/*
Theme Name: Energieberatung Kompass
Theme URI: https://energieberater-cc.de/
Description: Eigenstaendiges Ratgeber-Theme mit Themenkacheln, Schrittleiste und Quellenbox.
Version: 1.0.0
Text Domain: t-energieberater-cc-de
*/

:root{
  --bg:#f6f8f7; --surface:#ffffff; --text:#1b2b2a; --muted:#5d6f6d; --muted-text:#3f504e;
  --primary:#0f6b66; --primary-dark:#0a4a46; --accent:#e8a317; --link:#0b5a8a;
  --tint:#e6f1ef; --line:#d3dedb; --warn-bg:#fff8e6;
  --r:6px; --wrap:1320px;
  --f-head:"Work Sans",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  --f-body:"Source Sans 3",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font:400 18px/1.65 var(--f-body);overflow-wrap:break-word}
img,svg{max-width:100%;height:auto}
a{color:var(--link);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
h1,h2,h3,h4{font-family:var(--f-head);font-weight:600;line-height:1.25;color:var(--text);margin:0 0 .6em}
h1{font-size:2.3rem;letter-spacing:-.01em}
h2{font-size:1.55rem}
h3{font-size:1.2rem}
p{margin:0 0 1em}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip-link{position:absolute;left:-999px;top:0;background:var(--primary-dark);color:#fff;padding:10px 16px;z-index:100}
.skip-link:focus{left:0}
.ee-wrap{max-width:var(--wrap);margin:0 auto;padding:0 20px}

/* Disclaimer-Banner des Kerns: gestylt, nie versteckt */
.ps-disclaimer{background:var(--warn-bg)!important;color:var(--text)!important;border-bottom:2px solid var(--accent)!important;font:400 15px/1.5 var(--f-body)!important;padding:10px 20px!important}
.ps-disclaimer__inner{max-width:var(--wrap)!important}

/* Kopfzeile */
.ee-head{background:var(--surface);border-bottom:1px solid var(--line)}
.ee-head__top{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-top:14px;padding-bottom:14px}
.ee-brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--text)}
.ee-brand:hover{text-decoration:none}
.ee-brand svg{flex:none;width:40px;height:40px}
.ee-brand__name{font:600 1.35rem/1.1 var(--f-head);letter-spacing:-.01em;color:var(--primary-dark)}
.ee-brand__sub{display:block;font:400 .82rem/1.3 var(--f-body);color:var(--muted-text);margin-top:2px}
.ee-search{display:flex;border:1px solid var(--muted);border-radius:var(--r);background:var(--surface);overflow:hidden}
.ee-search input[type=search]{border:0;padding:9px 12px;font:400 1rem var(--f-body);color:var(--text);width:230px;background:transparent;min-width:0}
.ee-search input:focus{outline:none}
.ee-search:focus-within{outline:3px solid var(--accent)}
.ee-search button{border:0;background:var(--primary-dark);color:#fff;padding:0 14px;font:600 .95rem var(--f-head);cursor:pointer}
.ee-nav{border-top:1px solid var(--line);background:var(--surface)}
.ee-nav ul{list-style:none;margin:0 0 0 -14px;padding:0;display:flex;flex-wrap:wrap;gap:0 4px}
.ee-nav a{display:block;padding:10px 14px;font:600 .98rem var(--f-head);color:var(--text);text-decoration:none;border-bottom:3px solid transparent}
.ee-nav a:hover,.ee-nav .is-current a{border-bottom-color:var(--primary);color:var(--primary-dark);text-decoration:none}

/* Hero */
.ee-hero{padding:46px 0 34px}
.ee-hero__grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:48px;align-items:center}
.ee-eyebrow{display:inline-block;font:600 .85rem var(--f-head);letter-spacing:.06em;text-transform:uppercase;color:var(--primary-dark);margin-bottom:14px}
.ee-hero h1{margin-bottom:.5em}
.ee-hero__lead{font-size:1.18rem;color:var(--muted-text);max-width:34em}
.ee-hero__note{font-size:.95rem;color:var(--muted-text);border-left:3px solid var(--accent);padding-left:12px;margin-top:20px}
.ee-steps{list-style:none;margin:0;padding:0;display:grid;gap:12px;position:relative}
.ee-steps li{position:relative}
.ee-steps li:not(:last-child)::after{content:"";position:absolute;left:35px;top:100%;height:12px;border-left:2px dashed var(--primary)}
.ee-step{display:flex;gap:16px;align-items:flex-start;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;text-decoration:none;color:var(--text)}
.ee-step:hover{border-color:var(--primary);text-decoration:none;box-shadow:0 2px 0 var(--primary)}
.ee-step__n{flex:none;width:38px;height:38px;border-radius:50%;background:var(--primary-dark);color:#fff;font:600 1.1rem/38px var(--f-head);text-align:center}
.ee-step__t{display:block;font:600 1.12rem var(--f-head);color:var(--primary-dark)}
.ee-step__d{display:block;font-size:1rem;color:var(--muted-text);line-height:1.45;margin-top:2px}

/* Sektionen */
.ee-sec{padding:34px 0}
.ee-sec__head{display:flex;justify-content:space-between;align-items:baseline;gap:16px;flex-wrap:wrap;margin-bottom:20px}
.ee-sec__head h2{margin:0}
.ee-sec__head p{margin:0;color:var(--muted-text);font-size:1rem}

.ee-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.ee-tile{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-left:5px solid var(--primary);border-radius:var(--r);padding:20px 20px 18px;color:var(--text);text-decoration:none}
.ee-tile:nth-child(3n+2){border-left-color:var(--accent)}
.ee-tile:nth-child(3n){border-left-color:var(--link)}
.ee-tile:hover{border-color:var(--primary);text-decoration:none;box-shadow:0 2px 0 var(--line)}
.ee-tile svg{width:34px;height:34px;color:var(--primary-dark);margin-bottom:10px}
.ee-tile h3{margin:0 0 6px;font-size:1.2rem}
.ee-tile p{margin:0 0 12px;font-size:1rem;line-height:1.5;color:var(--muted-text)}
.ee-tile__go{margin-top:auto;font:600 .95rem var(--f-head);color:var(--link)}
.ee-tile__go.is-soon{color:var(--muted-text)}

/* Zweispaltiges Layout */
.ee-cols{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:40px;align-items:start}
.ee-main>section+section{margin-top:44px}
.ee-main h2{margin-bottom:16px}
.ee-side{display:grid;gap:18px;position:sticky;top:16px}
.ee-box{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:18px}
.ee-box h2,.ee-box h3{font-size:1.08rem;margin:0 0 10px}
.ee-box p,.ee-box li{font-size:1rem;line-height:1.5}
.ee-box ul{margin:0;padding-left:1.1em}
.ee-box li+li{margin-top:5px}
.ee-box--stand{border-top:4px solid var(--primary)}
.ee-box .meta{color:var(--muted-text);font-size:.95rem}
.ee-list-plain{list-style:none;padding:0!important;margin:0}
.ee-list-plain li{border-bottom:1px solid var(--line);padding:7px 0}
.ee-list-plain li:last-child{border:0}
.ee-ad{background:var(--warn-bg);border:1px solid #e6cf8a;border-left:5px solid var(--accent);border-radius:var(--r);padding:16px 18px}
.ee-ad__label{display:inline-block;background:var(--text);color:#fff;font:600 .78rem var(--f-head);letter-spacing:.08em;text-transform:uppercase;padding:2px 8px;border-radius:3px;margin-bottom:10px}
.ee-ad h2{font-size:1.05rem;margin:0 0 6px}
.ee-ad p{font-size:1rem;line-height:1.5;margin:0 0 12px}
.ee-ad__btn{display:inline-block;background:var(--primary-dark);color:#fff;font:600 .95rem var(--f-head);padding:9px 16px;border-radius:var(--r);text-decoration:none}
.ee-ad__btn:hover{background:var(--text);text-decoration:none}
.ee-ad small{display:block;margin-top:10px;color:var(--muted-text);font-size:.88rem;line-height:1.4}

/* Ratgeber-Liste */
.ee-posts{list-style:none;margin:0;padding:0;display:grid;gap:12px;counter-reset:ratg}
.ee-post{display:grid;grid-template-columns:44px 1fr;gap:16px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px 18px}
.ee-post::before{counter-increment:ratg;content:counter(ratg);width:36px;height:36px;border-radius:50%;border:2px solid var(--primary);color:var(--primary-dark);font:600 1rem/32px var(--f-head);text-align:center}
.ee-post h3{margin:0 0 4px;font-size:1.2rem}
.ee-post h3 a{color:var(--text);text-decoration:none}
.ee-post h3 a:hover{color:var(--link);text-decoration:underline}
.ee-post p{margin:0 0 6px;font-size:1rem;line-height:1.5;color:var(--muted-text)}
.ee-meta{font-size:.92rem;color:var(--muted-text)}
.ee-meta span+span::before{content:"·";margin:0 8px}
.ee-post--soon{background:transparent;border-style:dashed}
.ee-post--soon::before{border-color:var(--muted);color:var(--muted-text);content:"\2026"}
.ee-post--soon h3{color:var(--muted-text);font-size:1.05rem}

/* Foerder-Ampel-Tabelle */
.ee-tablewrap{overflow-x:auto;background:var(--surface);border:1px solid var(--line);border-radius:var(--r)}
.ee-ampel{width:100%;border-collapse:collapse;font-size:1rem;min-width:620px}
.ee-ampel caption{caption-side:bottom;text-align:left;padding:10px 14px;font-size:.92rem;color:var(--muted-text);border-top:1px solid var(--line)}
.ee-ampel th,.ee-ampel td{padding:11px 14px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line);word-break:normal;overflow-wrap:normal;hyphens:manual;line-height:1.45}
.ee-ampel thead th{background:var(--tint);font:600 .92rem var(--f-head);color:var(--text)}
.ee-ampel tbody tr:last-child td,.ee-ampel tbody tr:last-child th{border-bottom:0}
.ee-ampel tbody th{font-weight:600}
.ee-dot{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;font:600 .92rem var(--f-head)}
.ee-dot::before{content:"";width:14px;height:14px;border-radius:50%;background:var(--c);border:2px solid var(--text);flex:none}
.ee-dot--g{--c:#2e9e5b}.ee-dot--y{--c:var(--accent)}.ee-dot--r{--c:#c0392b}.ee-dot--n{--c:#ffffff}

/* Glossar-Teaser */
.ee-az{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 18px;padding:0;list-style:none}
.ee-az a,.ee-az span{display:block;min-width:36px;text-align:center;padding:5px 8px;border-radius:var(--r);font:600 1rem var(--f-head);border:1px solid var(--line)}
.ee-az a{background:var(--surface);color:var(--primary-dark);text-decoration:none;border-color:var(--primary)}
.ee-az a:hover{background:var(--primary-dark);color:#fff}
.ee-az span{color:#6c7b79;background:transparent;border-style:dashed}
.ee-terms{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.ee-term{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px}
.ee-term h3{margin:0 0 4px;font-size:1.05rem}
.ee-term p{margin:0;font-size:1rem;line-height:1.5;color:var(--muted-text)}

/* Betreiberband */
.ee-about{background:var(--tint);border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-top:30px}
.ee-about__in{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:40px;padding:34px 0;align-items:start}
.ee-about h2{margin-bottom:10px}
.ee-about p{margin-bottom:.7em}
.ee-about address{font-style:normal;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;font-size:1rem;line-height:1.55}

/* Seitenkopf innen */
.ee-pagehead{padding:34px 0 10px}
.ee-crumbs{font-size:.95rem;color:var(--muted-text);margin-bottom:12px}
.ee-crumbs a{color:var(--muted-text)}
.ee-pagehead h1{font-size:2.1rem;max-width:26em}
.ee-pagehead .ee-meta{margin-top:6px}

/* Artikel-Raster */
.ee-article{display:grid;grid-template-columns:200px minmax(0,720px) 290px;gap:32px;justify-content:start;align-items:start;padding:10px 0 20px}
.ee-wrap--article{max-width:var(--wrap)}
.ee-toc{position:sticky;top:16px;font-size:.98rem}
.ee-toc p{font:600 .85rem var(--f-head);letter-spacing:.06em;text-transform:uppercase;color:var(--primary-dark);margin:0 0 8px}
.ee-toc ol{list-style:none;margin:0;padding:0;border-left:2px solid var(--line);counter-reset:toc}
.ee-toc li{counter-increment:toc}
.ee-toc a{display:block;padding:5px 0 5px 14px;margin-left:-2px;border-left:2px solid transparent;color:var(--text);text-decoration:none;line-height:1.35}
.ee-toc a::before{content:counter(toc) ". ";font-weight:600;color:var(--primary-dark)}
.ee-toc a:hover{color:var(--link)}
.ee-toc a.is-on{border-left-color:var(--primary);font-weight:600;color:var(--primary-dark)}
.ee-toc--inline{display:none}

/* Inhalt */
.entry-content{font-size:1.125rem;line-height:1.7;counter-reset:schritt}
.entry-content>*:first-child{margin-top:0}
.entry-content h2{margin:1.8em 0 .6em;scroll-margin-top:16px;font-size:1.45rem}
.single-post .entry-content h2{counter-increment:schritt;display:flex;gap:12px;align-items:flex-start;margin:2em 0 .7em;padding-top:.2em;font-size:1.5rem}
.single-post .entry-content h2::before{content:counter(schritt);flex:none;width:34px;height:34px;margin-top:.02em;border-radius:50%;background:var(--primary-dark);color:#fff;font:600 1rem/34px var(--f-head);text-align:center}
.entry-content h3{margin:1.6em 0 .4em;font-size:1.2rem;color:var(--primary-dark)}
.entry-content ul,.entry-content ol{padding-left:1.4em;margin:0 0 1.2em}
.entry-content li{margin-bottom:.45em}
.entry-content li::marker{color:var(--primary-dark);font-weight:700}
.entry-content figure{margin:1.4em 0}
.entry-content figure.wp-block-table,.entry-content .wp-block-table{overflow-x:auto;background:var(--surface);border:1px solid var(--line);border-radius:var(--r)}
.entry-content table{border-collapse:collapse;width:100%;min-width:0;font-size:1rem;line-height:1.45;margin:0}
.entry-content table:has(th:nth-child(3)){min-width:520px}
.entry-content th,.entry-content td{padding:10px 14px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line);word-break:normal;overflow-wrap:normal;hyphens:manual}
.entry-content thead th{background:var(--tint);font:600 .95rem var(--f-head)}
.entry-content tbody tr:last-child td{border-bottom:0}
.entry-content tbody tr:nth-child(even) td{background:#fafcfb}
.entry-content figcaption,.entry-content .wp-element-caption{padding:10px 14px;font-size:.92rem;color:var(--muted-text);border-top:1px solid var(--line);text-align:left}
.entry-content .anzeige{background:var(--warn-bg);border:1px solid #e6cf8a;border-left:5px solid var(--accent);border-radius:var(--r);padding:16px 20px;margin:1.8em 0;font-size:1.02rem;line-height:1.6}
.entry-content .anzeige-label{display:inline-block;background:var(--text);color:#fff;font:600 .78rem var(--f-head);letter-spacing:.08em;text-transform:uppercase;padding:2px 8px;border-radius:3px;margin-right:8px}
.entry-content blockquote{margin:1.4em 0;padding:4px 0 4px 18px;border-left:4px solid var(--primary)}
.entry-content a{overflow-wrap:anywhere}

/* Quellenbox */
.ee-quellen{margin:36px 0 0;background:var(--surface);border:1px solid var(--line);border-top:4px solid var(--primary);border-radius:var(--r);padding:20px 24px}
.ee-quellen h2{font-size:1.2rem;margin:0 0 6px}
.ee-quellen .stand{margin:0 0 12px;font-weight:600}
.ee-quellen ul{margin:0 0 12px;padding-left:1.2em;font-size:1rem}
.ee-quellen li{margin-bottom:4px;overflow-wrap:anywhere}
.ee-quellen p:last-child{margin:0;font-size:.95rem;color:var(--muted-text)}
.ee-weiter{margin-top:30px}
.ee-weiter h2{font-size:1.2rem}

/* Kompass-Lesefortschritt */
.ee-kompass{position:fixed;right:14px;top:22vh;height:46vh;width:34px;z-index:20;pointer-events:none}
.ee-kompass__track{position:absolute;left:16px;top:17px;bottom:17px;width:2px;background:var(--line)}
.ee-kompass__fill{position:absolute;left:0;top:0;width:2px;background:var(--primary);height:0}
.ee-kompass__g{position:absolute;left:0;top:0;width:34px;height:34px;background:var(--surface);border-radius:50%;box-shadow:0 0 0 1px var(--primary);display:block;transform:translateY(0)}
.ee-kompass__g svg{display:block;width:34px;height:34px}
.ee-kompass__n{transform-origin:17px 17px;transform:rotate(0)}

/* Fussleiste */
.ee-foot{background:#10201f;color:#e9f1ef;margin-top:50px}
.ee-foot a{color:#ffffff}
.ee-foot__grid{display:grid;grid-template-columns:1fr 1fr 1.4fr;gap:40px;padding:40px 0 26px}
.ee-foot h2{font-size:1rem;color:#fff;text-transform:uppercase;letter-spacing:.06em;margin-bottom:12px}
.ee-foot ul{list-style:none;margin:0;padding:0}
.ee-foot li{margin-bottom:6px}
.ee-foot p{font-size:.98rem;line-height:1.55;margin:0 0 .8em}
.ee-foot__bar{border-top:1px solid #35504d;padding:16px 0 22px;font-size:.92rem;color:#d4e2df}

.ee-empty{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:24px}
.ee-pagination{margin-top:20px}
.ee-pagination .nav-links{display:flex;gap:8px;flex-wrap:wrap}
.ee-pagination a,.ee-pagination span{padding:6px 12px;border:1px solid var(--line);border-radius:var(--r);background:var(--surface)}

/* Glossar */
.ee-gloss dt{font:600 1.2rem var(--f-head);color:var(--primary-dark);margin-top:1.4em;scroll-margin-top:16px}
.ee-gloss dd{margin:.2em 0 0}
.ee-gloss h2{margin-top:1.6em;border-bottom:2px solid var(--primary);padding-bottom:4px;scroll-margin-top:16px}
.entry-content .ee-gloss h2{display:block}
.entry-content .ee-gloss h2::before{content:none}

@media (max-width:1360px){
  .ee-article{grid-template-columns:minmax(0,720px) 290px}
  .ee-toc--side{display:none}
  .ee-toc--inline{display:block;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:12px 16px;margin-bottom:26px}
  .ee-toc--inline summary{font:600 1rem var(--f-head);cursor:pointer}
  .ee-toc--inline ol{margin-top:10px}
}
@media (max-width:1000px){
  .ee-hero__grid,.ee-cols,.ee-about__in,.ee-article{grid-template-columns:minmax(0,1fr)}
  .ee-side{position:static}
  .ee-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ee-foot__grid{grid-template-columns:1fr 1fr}
  .ee-kompass{display:none}
}
@media (max-width:640px){
  body{font-size:17px}
  h1{font-size:1.75rem}
  .ee-pagehead h1{font-size:1.65rem}
  .ee-head__top{flex-direction:column;align-items:stretch;gap:12px}
  .ee-search{width:100%}
  .ee-search input[type=search]{width:100%;flex:1}
  .ee-nav ul{margin-left:-10px}
  .ee-nav a{padding:9px 10px;font-size:.95rem}
  .ee-hero{padding:28px 0 20px}
  .ee-tiles,.ee-terms,.ee-foot__grid{grid-template-columns:minmax(0,1fr)}
  .ee-post{grid-template-columns:36px 1fr;gap:12px;padding:14px}
  .entry-content{font-size:1.0625rem}
  .entry-content h2,.single-post .entry-content h2{font-size:1.3rem}
  .ee-quellen{padding:16px}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.entry-content .wp-block-table{margin:1.2em 0 1.4em}
.entry-content figure.ee-uskala{margin:1.2em 0}
