/* energienachhalt.de · Stylesheet v1
   Basis: Nachtblau + Sonnengelb. Gelb nur für Handlung, Fahrplan-Linie und Fokus auf dunklem Grund.
   Regeln: Basis-Regel steht immer VOR den Modifiern, Kontraste mindestens 4,5:1 (geprüft). */

@font-face { font-family: "Bricolage Grotesque"; src: url("fonts/bricolage-grotesque-latin-wght-normal.woff2") format("woff2"); font-weight: 200 800; font-style: normal; font-display: swap; }
@font-face { font-family: "Source Serif 4"; src: url("fonts/source-serif-4-latin-wght-normal.woff2") format("woff2"); font-weight: 200 900; font-style: normal; font-display: swap; }

:root {
  --night: #0E2038; --deep: #17325A; --paper: #F4F6FA; --white: #FFFFFF;
  --ink: #14233B; --muted: #4A5B74; --blue: #1B4F9C; --sun: #FFC83D; --sun-soft: #FFF4D1; --sun-ink: #7A5200;
  --line: #D5DDE9; --night-line: #2A4468; --night-muted: #B7C4D9; --tint: #E8EEF8;
  --f-head: "Bricolage Grotesque", "Avenir Next", "Segoe UI Variable", "Segoe UI", system-ui, sans-serif;
  --f-body: "Source Serif 4", Georgia, "Times New Roman", serif;
  --gutter: 1rem; --maxw: 68rem; --read: 44rem;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body.enh-body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--f-body); font-size: 1.0625rem; line-height: 1.65; -webkit-font-smoothing: antialiased; }
.enh-body img, .enh-body svg { max-width: 100%; }
.enh-body a { color: var(--blue); text-underline-offset: 0.18em; text-decoration-thickness: 0.08em; }
.enh-body a:hover { text-decoration-thickness: 0.16em; }
.enh-body h1, .enh-body h2, .enh-body h3, .enh-body h4 { font-family: var(--f-head); color: var(--ink); line-height: 1.15; margin: 0 0 0.6em; letter-spacing: -0.015em; }
.enh-body h1 { font-size: clamp(1.9rem, 4.6vw, 3.1rem); font-weight: 700; letter-spacing: -0.025em; line-height: 1.06; }
.enh-body h2 { font-size: clamp(1.45rem, 2.8vw, 1.95rem); font-weight: 700; }
.enh-body h3 { font-size: 1.2rem; font-weight: 650; }
.enh-body p { margin: 0 0 1.05em; }
.enh-body :focus-visible { outline: 3px solid var(--blue); outline-offset: 2px; border-radius: 2px; }
.enh-dark :focus-visible { outline-color: var(--sun); }
.enh-skip { position: absolute; left: -999px; top: 0; background: var(--sun); color: var(--night); padding: 0.6rem 1rem; z-index: 99; font-family: var(--f-head); font-weight: 600; }
.enh-skip:focus { left: 0; }
.enh-wrap { width: 100%; max-width: var(--maxw); margin: 0 auto; padding: 0 var(--gutter); }
.enh-read { max-width: var(--read); }

/* ---------------------------------------------------------------- Kopf */
.enh-top { background: var(--night); color: #fff; border-bottom: 1px solid var(--night-line); }
.enh-top .enh-wrap { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.5rem 1.5rem; padding-top: 0.85rem; padding-bottom: 0.85rem; }
.enh-logo { display: inline-flex; align-items: center; gap: 0.6rem; text-decoration: none; color: #fff; }
.enh-body .enh-top a.enh-logo { color: #fff; }
.enh-logo svg { width: 2.25rem; height: 2.25rem; flex: none; }
.enh-wm { font-family: var(--f-head); font-weight: 700; font-size: 1.3rem; letter-spacing: -0.02em; }
.enh-wm em { font-style: normal; color: var(--sun); }
.enh-nav { display: flex; flex-wrap: wrap; gap: 0.25rem 1.25rem; margin: 0; padding: 0; list-style: none; }
.enh-body .enh-nav a { color: #fff; text-decoration: none; font-family: var(--f-head); font-weight: 550; font-size: 0.98rem; padding: 0.35rem 0; border-bottom: 2px solid transparent; }
.enh-body .enh-nav a:hover, .enh-body .enh-nav a[aria-current="page"] { border-bottom-color: var(--sun); }

/* ---------------------------------------------------------------- Hero */
.enh-hero { position: relative; overflow: hidden; background: var(--night); color: #fff; padding: 2.2rem 0 2.6rem; }
.enh-hero > .enh-wrap { position: relative; z-index: 1; }
.enh-hero .enh-sun { position: absolute; right: -4%; bottom: -2px; width: min(46rem, 92%); height: auto; z-index: 0; pointer-events: none; opacity: 0.4; }
.enh-hero h1, .enh-hero .enh-lede { color: #fff; max-width: 40rem; }
.enh-body .enh-hero h1 { color: #fff; }
.enh-lede { font-size: 1.15rem; color: var(--night-muted); max-width: 36rem; }
.enh-hero a { color: var(--sun); }
.enh-crumbs { font-family: var(--f-head); font-size: 0.92rem; margin: 0 0 1.1rem; }
.enh-crumbs ol { display: flex; flex-wrap: wrap; gap: 0.15rem 0.5rem; margin: 0; padding: 0; list-style: none; }
.enh-crumbs li + li::before { content: "/"; margin-right: 0.5rem; color: var(--night-muted); }
.enh-crumbs a { color: var(--night-muted); text-decoration: none; }
.enh-crumbs a:hover { color: #fff; text-decoration: underline; }
.enh-crumbs [aria-current] { color: #fff; }

.enh-search { position: relative; max-width: 34rem; margin-top: 1.4rem; }
.enh-search form { display: flex; gap: 0.5rem; }
.enh-search input[type="search"] { flex: 1; min-width: 0; height: 3.4rem; padding: 0 1rem; font: 500 1.05rem var(--f-head); color: var(--ink); background: #fff; border: 2px solid #fff; border-radius: 6px; }
.enh-search input[type="search"]::placeholder { color: var(--muted); }
.enh-btn { display: inline-flex; align-items: center; justify-content: center; height: 3.4rem; padding: 0 1.4rem; font: 650 1rem var(--f-head); color: var(--night); background: var(--sun); border: 0; border-radius: 6px; cursor: pointer; text-decoration: none; }
.enh-btn:hover { background: #FFD25F; }
.enh-body a.enh-btn { color: var(--night); text-decoration: none; }
.enh-suggest { position: absolute; left: 0; right: 0; top: calc(100% + 4px); z-index: 20; margin: 0; padding: 0.3rem 0; list-style: none; background: #fff; border: 1px solid var(--line); border-radius: 6px; box-shadow: 0 10px 30px rgba(14, 32, 56, 0.28); }
.enh-suggest[hidden] { display: none; }
.enh-suggest li a { display: flex; justify-content: space-between; gap: 1rem; padding: 0.6rem 1rem; color: var(--ink); text-decoration: none; font-family: var(--f-head); font-weight: 550; }
.enh-suggest li a small { color: var(--muted); font-weight: 400; }
.enh-suggest li a:hover, .enh-suggest li a[aria-selected="true"] { background: var(--tint); }
.enh-suggest .enh-empty { padding: 0.6rem 1rem; color: var(--muted); font-family: var(--f-head); }
.enh-hint { margin: 0.7rem 0 0; font-size: 0.95rem; color: var(--night-muted); }

.enh-facts { display: flex; flex-wrap: wrap; gap: 1.2rem 2.4rem; margin: 1.6rem 0 0; padding: 0; list-style: none; }
.enh-facts li { display: flex; flex-direction: column; }
.enh-facts b { font-family: var(--f-head); font-weight: 700; font-size: 1.55rem; line-height: 1.1; color: #fff; letter-spacing: -0.02em; }
.enh-facts span { font-family: var(--f-head); font-size: 0.92rem; color: var(--night-muted); }

/* ---------------------------------------------------------------- Flächen */
.enh-main { display: block; }
.enh-band { padding: 3rem 0; }
.enh-band--white { background: var(--white); }
.enh-band h2 { max-width: 40rem; }
.enh-intro { max-width: 40rem; color: var(--muted); font-size: 1.1rem; }

.enh-trio { display: grid; grid-template-columns: 1fr; gap: 0; margin: 2rem 0 0; padding: 0; list-style: none; border-top: 4px solid var(--night); }
.enh-trio > li { padding: 1.4rem 0 1.6rem; border-bottom: 1px solid var(--line); }
.enh-trio .enh-no { display: inline-flex; align-items: center; justify-content: center; width: 2.4rem; height: 2.4rem; border-radius: 50%; background: var(--night); color: var(--sun); font: 700 1.15rem var(--f-head); margin-bottom: 0.8rem; }
.enh-trio h3 { margin-bottom: 0.4em; }
.enh-trio p { color: var(--muted); max-width: 22rem; }

.enh-routes { display: grid; grid-template-columns: 1fr; margin: 2rem 0 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.enh-routes li { border-bottom: 1px solid var(--line); }
.enh-routes a { display: grid; grid-template-columns: 1fr; gap: 0.15rem; padding: 1.1rem 0; text-decoration: none; color: var(--ink); }
.enh-routes a:hover strong { text-decoration: underline; text-decoration-thickness: 0.1em; }
.enh-routes strong { font-family: var(--f-head); font-size: 1.2rem; font-weight: 650; color: var(--blue); }
.enh-routes span { color: var(--muted); }

.enh-chips { display: flex; flex-wrap: wrap; gap: 0.5rem; margin: 1.2rem 0 0; padding: 0; list-style: none; }
.enh-chips a, .enh-chips span { display: inline-block; padding: 0.4rem 0.9rem; border: 1px solid var(--line); border-radius: 999px; background: #fff; font-family: var(--f-head); font-weight: 500; font-size: 0.97rem; text-decoration: none; color: var(--ink); }
.enh-chips a { color: var(--blue); border-color: #B9C8E0; }
.enh-chips a:hover { background: var(--tint); }
.enh-chips span { color: var(--muted); background: transparent; border-style: dashed; }

.enh-principles { display: grid; grid-template-columns: 1fr; gap: 1.6rem; margin: 2rem 0 0; }
.enh-principles h3 { margin-bottom: 0.35em; padding-top: 0.8rem; border-top: 3px solid var(--sun); }
.enh-principles p { color: var(--muted); margin: 0; }
.enh-principles a { display: inline-block; margin-top: 0.7rem; font-weight: 600; color: var(--blue); }

/* ---------------------------------------------------------------- Stadtseite */
.enh-answer { background: var(--sun-soft); border-left: 5px solid var(--sun); padding: 1.1rem 1.25rem 0.2rem; margin: 2rem 0 1.4rem; max-width: var(--read); }
.enh-answer strong { display: block; font-family: var(--f-head); font-size: 1.05rem; margin-bottom: 0.3rem; color: var(--ink); }
.enh-lead { max-width: var(--read); font-size: 1.12rem; }

.enh-path { position: relative; margin: 2.2rem 0 0.5rem; padding: 0; list-style: none; display: grid; grid-template-columns: 1fr; gap: 0.2rem; max-width: var(--read); }
.enh-path li a { display: grid; grid-template-columns: 2.6rem 1fr; gap: 0.9rem; align-items: center; padding: 0.5rem 0; text-decoration: none; color: var(--ink); font-family: var(--f-head); font-weight: 600; }
.enh-path li a:hover span:last-child { text-decoration: underline; text-decoration-thickness: 0.1em; }
.enh-path .enh-no { display: inline-flex; align-items: center; justify-content: center; width: 2.6rem; height: 2.6rem; border-radius: 50%; background: var(--night); color: var(--sun); font: 700 1.2rem var(--f-head); }

.enh-stage { position: relative; display: grid; grid-template-columns: 1fr; gap: 0; padding: 2.4rem 0 0.6rem; scroll-margin-top: 1rem; }
.enh-stage > .enh-rail { display: none; }
.enh-stage .enh-body-col { max-width: var(--read); }
.enh-stage .enh-no { display: inline-flex; align-items: center; justify-content: center; width: 2.6rem; height: 2.6rem; border-radius: 50%; background: var(--night); color: var(--sun); font: 700 1.2rem var(--f-head); margin-bottom: 0.8rem; }

.enh-steps { margin: 1.4rem 0 1.4rem; padding: 0 0 0 1.35rem; max-width: var(--read); }
.enh-steps li { margin: 0 0 0.45rem; padding-left: 0.3rem; }
.enh-steps li::marker { font-family: var(--f-head); font-weight: 700; color: var(--blue); }
.enh-steps-title { font: 650 1.05rem var(--f-head); margin: 1.6rem 0 0; }

.enh-tablewrap { max-width: var(--read); overflow-x: auto; margin: 1.2rem 0 1.4rem; }
.enh-table { width: 100%; border-collapse: collapse; background: #fff; font-size: 0.98rem; }
.enh-table caption { text-align: left; font: 650 1.02rem var(--f-head); padding: 0 0 0.5rem; color: var(--ink); }
.enh-table th, .enh-table td { text-align: left; vertical-align: top; padding: 0.65rem 0.8rem; border-top: 1px solid var(--line); }
.enh-table tr:last-child th, .enh-table tr:last-child td { border-bottom: 1px solid var(--line); }
.enh-table th { width: 42%; font-family: var(--f-head); font-weight: 600; color: var(--ink); }
.enh-table td { color: var(--ink); }

.enh-source { max-width: var(--read); background: #fff; border: 1px solid var(--line); border-left: 4px solid var(--night); padding: 1rem 1.15rem 0.9rem; margin: 1.4rem 0; }
.enh-source p { margin: 0 0 0.6rem; }
.enh-source .enh-links { display: flex; flex-wrap: wrap; gap: 0.4rem 1.2rem; margin: 0; padding: 0; list-style: none; font-family: var(--f-head); font-weight: 600; }
.enh-source .enh-links a::after { content: " \2197"; font-weight: 400; }

.enh-tip { max-width: var(--read); background: var(--tint); padding: 1.1rem 1.25rem 0.3rem; margin: 2.4rem 0 1.2rem; border-left: 5px solid var(--deep); }
.enh-tip strong { display: block; font-family: var(--f-head); font-size: 1.05rem; margin-bottom: 0.3rem; }

.enh-faq { max-width: var(--read); margin: 1.4rem 0 0; }
.enh-faq details { border-top: 1px solid var(--line); }
.enh-faq details:last-child { border-bottom: 1px solid var(--line); }
.enh-faq summary { cursor: pointer; list-style: none; position: relative; padding: 1rem 2.2rem 1rem 0; font: 600 1.08rem var(--f-head); }
.enh-faq summary::-webkit-details-marker { display: none; }
.enh-faq summary::after { content: "+"; position: absolute; right: 0.2rem; top: 0.85rem; font: 400 1.6rem/1 var(--f-head); color: var(--blue); }
.enh-faq details[open] summary::after { content: "\2212"; }
.enh-faq details p { margin: 0 0 1.1rem; }

.enh-disc { max-width: var(--read); margin: 2.4rem 0 0; padding-top: 1rem; border-top: 1px solid var(--line); font-size: 0.95rem; color: var(--muted); }

/* ---------------------------------------------------------------- Index, Glossar, Ratgeber */
.enh-list { margin: 1.6rem 0 0; padding: 0; list-style: none; border-top: 1px solid var(--line); max-width: var(--read); }
.enh-list li { border-bottom: 1px solid var(--line); }
.enh-list a { display: block; padding: 1rem 0; text-decoration: none; color: var(--ink); }
.enh-list a strong { display: block; font: 650 1.15rem var(--f-head); color: var(--blue); }
.enh-list a:hover strong { text-decoration: underline; text-decoration-thickness: 0.1em; }
.enh-list a span { color: var(--muted); }
.enh-blocks details { border-top: 1px solid var(--line); padding: 0.2rem 0; }
.enh-blocks details:last-child { border-bottom: 1px solid var(--line); }
.enh-blocks summary { cursor: pointer; padding: 0.9rem 0; font: 650 1.15rem var(--f-head); }
.enh-blocks summary small { font-weight: 400; color: var(--muted); margin-left: 0.5rem; }
.enh-blocks .enh-chips { margin-bottom: 1.2rem; }
.enh-article h2 { margin-top: 2.2rem; }
.enh-meta { color: var(--night-muted); font-family: var(--f-head); font-size: 0.95rem; margin: 1rem 0 0; }
.enh-sources { max-width: var(--read); margin: 2rem 0 0; padding: 1rem 0 0; border-top: 1px solid var(--line); font-family: var(--f-head); }
.enh-sources h2 { font-size: 1.1rem; margin: 0 0 0.5rem; }
.enh-sources ul { margin: 0; padding-left: 1.2rem; }

/* ---------------------------------------------------------------- Wegweiser */
.enh-guide { max-width: var(--read); margin: 1.8rem 0 0; }
.enh-guide fieldset { border: 0; padding: 0; margin: 0 0 1.4rem; }
.enh-guide legend { font: 650 1.1rem var(--f-head); padding: 0; margin-bottom: 0.6rem; }
.enh-guide label { display: flex; align-items: center; gap: 0.7rem; padding: 0.7rem 0.9rem; margin-bottom: 0.4rem; background: #fff; border: 1px solid var(--line); border-radius: 6px; cursor: pointer; font-family: var(--f-head); font-weight: 550; }
.enh-guide label:has(input:checked) { border-color: var(--night); background: var(--sun-soft); }
.enh-guide input[type="radio"] { accent-color: var(--night); width: 1.1rem; height: 1.1rem; }
.enh-guide-result { max-width: var(--read); background: #fff; border: 1px solid var(--line); border-left: 5px solid var(--sun); padding: 1.2rem 1.3rem 0.6rem; margin-top: 1.6rem; }
.enh-guide-result[hidden] { display: none; }
.enh-guide-result h2 { font-size: 1.35rem; }

/* ---------------------------------------------------------------- Fuß */
.enh-foot { background: var(--night); color: var(--night-muted); padding: 2.6rem 0 1.6rem; margin-top: 3rem; font-size: 0.98rem; }
.enh-foot h2 { font-size: 1.05rem; color: #fff; margin: 0 0 0.6rem; }
.enh-body .enh-foot h2 { color: #fff; }
.enh-foot a { color: #fff; }
.enh-foot .enh-cols { display: grid; grid-template-columns: 1fr; gap: 1.8rem; }
.enh-foot ul { margin: 0; padding: 0; list-style: none; }
.enh-foot li { margin: 0.25rem 0; }
.enh-foot .enh-legal { margin-top: 2rem; padding-top: 1.1rem; border-top: 1px solid var(--night-line); font-size: 0.92rem; }
.enh-foot p { margin: 0 0 0.6rem; }

/* ---------------------------------------------------------------- Breite Bildschirme */
@media (min-width: 40rem) {
  .enh-hero .enh-sun { opacity: 1; }
  :root { --gutter: 1.5rem; }
  .enh-hero { padding: 3.2rem 0 3.6rem; }
  .enh-trio { grid-template-columns: repeat(3, 1fr); }
  .enh-trio > li { padding: 1.6rem 1.6rem 1.8rem 0; border-bottom: 0; }
  .enh-trio > li + li { padding-left: 1.6rem; border-left: 1px solid var(--line); }
  .enh-routes { grid-template-columns: 1fr 1fr; column-gap: 3rem; }
  .enh-principles { grid-template-columns: repeat(3, 1fr); gap: 2rem; }
  .enh-foot .enh-cols { grid-template-columns: 1.4fr 1fr 1fr 1fr; }
  .enh-path { grid-template-columns: repeat(3, auto); justify-content: start; gap: 0 2.4rem; max-width: none; }
  .enh-path li:not(:last-child) a { position: relative; }
  .enh-path li a { grid-template-columns: 2.6rem auto; }
}
@media (min-width: 64rem) {
  .enh-stage { grid-template-columns: 4.5rem 1fr; }
  .enh-stage > .enh-rail { display: block; position: relative; }
  .enh-stage > .enh-rail::before { content: ""; position: absolute; left: 1.3rem; top: 2.9rem; bottom: -0.6rem; width: 3px; background: var(--sun); border-radius: 2px; }
  .enh-stage:last-of-type > .enh-rail::before { display: none; }
  .enh-stage .enh-body-col .enh-no { display: none; }
  .enh-stage > .enh-rail .enh-no { margin: 0; }
}

/* Hero-Sonne: einmaliges Aufgehen beim Laden, bei reduzierter Bewegung aus */
@media (prefers-reduced-motion: no-preference) {
  .enh-hero .enh-sun .enh-rise { animation: enh-rise 1.1s cubic-bezier(.2, .7, .2, 1) both; }
  @keyframes enh-rise { from { transform: translateY(28px); opacity: 0; } to { transform: none; opacity: 1; } }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
.enh-read .enh-caps { font-size: .875rem; line-height: 1.6; }

/* Formular für Betriebe */
.enh-form { margin-top: 1rem; max-width: 40rem; }
.enh-field { margin: 0 0 1.1rem; padding: 0; border: 0; }
.enh-field > label:not(.enh-check), .enh-field > legend { display: block; font-family: var(--enh-head, inherit); font-weight: 600; margin-bottom: .3rem; padding: 0; }
.enh-field small { display: block; color: #4a5a72; margin: 0 0 .3rem; font-size: .875rem; line-height: 1.45; }
.enh-form input[type="text"], .enh-form input[type="email"], .enh-form input[type="tel"], .enh-form textarea, .enh-form input[type="file"] { width: 100%; box-sizing: border-box; font: inherit; padding: .65rem .75rem; border: 1px solid #8a97ab; border-radius: 4px; background: #fff; color: #0E2038; }
.enh-form input:focus-visible, .enh-form textarea:focus-visible { outline: 3px solid #FFC83D; outline-offset: 1px; border-color: #0E2038; }
.enh-check { display: flex; gap: .6rem; align-items: flex-start; margin: .35rem 0; line-height: 1.5; font-weight: 400; }
.enh-check input { margin-top: .3rem; flex: 0 0 auto; width: 1.1rem; height: 1.1rem; }
.enh-row { display: grid; gap: 0 1rem; }
.has-error input[type="text"], .has-error input[type="email"], .has-error input[type="tel"], .has-error textarea { border-color: #a4161a; }
.enh-err { color: #a4161a; margin: .3rem 0 0; font-size: .9375rem; }
.enh-errbox { border-left: 4px solid #a4161a; background: #fdeeee; padding: .8rem 1rem; margin: 1rem 0; max-width: 40rem; }
.enh-ok { border-left: 4px solid #FFC83D; background: #fff3cf; padding: 1rem 1.2rem; max-width: 40rem; }
.enh-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
@media (min-width: 40rem) { .enh-row { grid-template-columns: 1fr 2fr; } .enh-row:nth-of-type(2) { grid-template-columns: 1fr 1fr; } }

/* Anmelde-Hinweise für Betriebe */
.enh-body .enh-nav .enh-nav-cta a.enh-btn { border-bottom: 0; padding: .45rem .9rem; color: var(--ink, #0E2038); font-size: .95rem; }
.enh-btn--sm { font-size: .95rem; }
.enh-cta { background: var(--sun, #FFC83D); color: #0E2038; padding: 2rem 0; }
.enh-cta .enh-wrap { display: grid; gap: 1rem; align-items: center; }
.enh-cta h2 { margin: 0 0 .3rem; color: #0E2038; font-size: 1.35rem; }
.enh-cta p { margin: 0; color: #0E2038; }
.enh-cta .enh-btn { background: #0E2038; color: #fff; justify-self: start; }
.enh-cta .enh-btn:hover { background: #17325A; }
.enh-inline-cta { margin: 2rem 0; padding: 1rem 1.2rem; border: 2px solid #FFC83D; background: #fff8e1; display: grid; gap: .8rem; max-width: 40rem; }
.enh-inline-cta p { margin: 0; }
@media (min-width: 40rem) { .enh-cta .enh-wrap { grid-template-columns: 1fr auto; } .enh-inline-cta { grid-template-columns: 1fr auto; align-items: center; } }

/* Solarertrag und Rechner */
.enh-pv { margin: 2.5rem 0; }
.enh-bars { margin: 1.2rem 0; max-width: 32rem; }
.enh-bars svg { width: 100%; height: auto; display: block; }
.enh-bars figcaption { font-size: .875rem; color: #3b4a62; margin-top: .3rem; }
.enh-note { font-size: .9rem; line-height: 1.55; color: #3b4a62; max-width: 40rem; }
.enh-more { margin: 1rem 0; max-width: 32rem; }
.enh-more summary { cursor: pointer; font-weight: 600; }
.enh-unit { display: flex; align-items: center; gap: .6rem; }
.enh-unit input { max-width: 11rem; width: 100%; box-sizing: border-box; font: inherit; padding: .65rem .75rem; border: 1px solid #8a97ab; border-radius: 4px; background: #fff; color: #0E2038; }
.enh-unit span { color: #3b4a62; }
.enh-form select { width: 100%; max-width: 24rem; box-sizing: border-box; font: inherit; padding: .65rem .75rem; border: 1px solid #8a97ab; border-radius: 4px; background: #fff; color: #0E2038; }
.enh-calc .enh-result { margin: 1.5rem 0; padding: 1.2rem 1.4rem; background: #fff; border-left: 4px solid #FFC83D; max-width: 40rem; }
.enh-facts--calc { margin: .5rem 0 1rem; }
.enh-facts--calc li, .enh-facts--calc b { color: #0E2038; }
.enh-facts--calc span { color: #3b4a62; }

/* Stadtseiten-Module */
.enh-mod { max-width: var(--read); margin: 2.6rem 0; padding-top: 1.6rem; border-top: 1px solid var(--line); }
.enh-mod:first-of-type { border-top: 0; padding-top: 0; }
.enh-mod h2 { font-family: var(--f-head); font-weight: 650; line-height: 1.2; margin: 0 0 .8rem; }
.enh-onpage { margin: 1.4rem 0 .4rem; }
.enh-onpage ul { display: flex; flex-wrap: wrap; gap: .5rem; list-style: none; margin: 0; padding: 0; }
.enh-onpage a { display: inline-block; padding: .35rem .85rem; border: 1px solid #B9C8E0; border-radius: 999px; font: 500 .95rem var(--f-head); color: var(--blue); text-decoration: none; background: #fff; }
.enh-onpage a:hover { background: var(--tint); }
.enh-cmp { margin: 1.1rem 0; max-width: 32rem; display: grid; gap: .45rem; }
.enh-cmp-row { display: grid; grid-template-columns: 7.5rem 1fr auto; align-items: center; gap: .7rem; font-size: .95rem; }
.enh-cmp-row span { font-family: var(--f-head); color: var(--muted); overflow-wrap: anywhere; }
.enh-cmp-row i { display: block; height: .8rem; background: var(--deep); border-radius: 2px; min-width: 3px; }
.enh-cmp-row.is-me i { background: #B8860B; }
.enh-cmp-row.is-me span { color: var(--ink); font-weight: 600; }
.enh-cmp-row b { font: 600 .95rem var(--f-head); white-space: nowrap; }
@media (max-width: 30rem) { .enh-cmp-row { grid-template-columns: 5.5rem 1fr; } .enh-cmp-row b { grid-column: 2; } }
.enh-rank { list-style: decimal; padding-left: 2rem; margin: 1rem 0; max-width: 28rem; }
.enh-rank li { padding: .45rem .3rem; border-bottom: 1px solid var(--line); }
.enh-rank li span { display: inline-block; min-width: 55%; }
.enh-rank li b { font-family: var(--f-head); }
.enh-rank li.is-me { background: var(--sun-soft); font-weight: 600; }
.enh-nbt { min-width: 36rem; }
.enh-nbt th, .enh-nbt td { width: auto; }
.enh-nbt thead th { font-size: .85rem; color: var(--muted); border-top: 0; }
.enh-nbt tr.is-me th, .enh-nbt tr.is-me td { background: var(--sun-soft); }
.enh-nbt td { text-align: right; font-variant-numeric: tabular-nums; }
.enh-nbt thead th:not(:first-child) { text-align: right; }
.enh-h3 { font: 650 1.1rem var(--f-head); margin: 0 0 .5rem; }
.enh-city .enh-wrap > .enh-lead { margin-top: 1.8rem; }

/* ---- Datenseiten und Werkzeuge (v1.4) ---- */
.enh-wide { max-width: 52rem; }
.enh-rankt th, .enh-rankt td { white-space: nowrap; }
.enh-rankt thead th { width: auto; font-size: .875rem; color: var(--muted); font-weight: 600; border-top: 0; }
.enh-rankt tbody th { width: auto; font-weight: 600; white-space: normal; min-width: 9rem; }
.enh-rankt td:first-child { color: var(--muted); width: 3rem; }
.enh-rankt .enh-r, .enh-r { text-align: right; }
.enh-rankt abbr { text-decoration: none; cursor: help; color: #8a5a00; font-weight: 700; }
.enh-bars--wide { max-width: 40rem; }
.enh-tool { margin: 1.6rem 0 2rem; }
.enh-tool-ui { background: #fff; border: 1px solid var(--line); border-radius: 6px; padding: 1.2rem 1.2rem 1.4rem; max-width: 52rem; }
.enh-tool-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); gap: 1rem; margin-bottom: 1rem; }
.enh-tool .enh-pick { position: relative; }
.enh-tool label { display: block; font: 600 .9rem var(--f-head); color: var(--ink); margin-bottom: .25rem; }
.enh-tool input, .enh-tool select { width: 100%; font: inherit; padding: .55rem .65rem; border: 1px solid #9aa7bb; border-radius: 4px; background: #fff; color: var(--ink); min-height: 2.6rem; }
.enh-tool input:focus-visible, .enh-tool select:focus-visible, .enh-tool button:focus-visible, .enh-tool .enh-sug a:focus-visible { outline: 3px solid #B8860B; outline-offset: 1px; }
.enh-tool .enh-sug { position: absolute; z-index: 5; left: 0; right: 0; top: 100%; margin: 2px 0 0; padding: 0; list-style: none; background: #fff; border: 1px solid #9aa7bb; border-radius: 4px; max-height: 15rem; overflow-y: auto; box-shadow: 0 6px 18px rgba(14,32,56,.14); }
.enh-tool .enh-sug a { display: flex; justify-content: space-between; gap: .6rem; padding: .5rem .65rem; color: var(--ink); text-decoration: none; cursor: pointer; }
.enh-tool .enh-sug a:hover, .enh-tool .enh-sug a[aria-selected="true"] { background: #FFF4D6; }
.enh-tool .enh-sug small { color: var(--muted); }
.enh-tool-out { margin-top: 1.2rem; }
.enh-tool-out table { width: 100%; border-collapse: collapse; font-size: .98rem; }
.enh-tool-out th, .enh-tool-out td { padding: .55rem .6rem; border-top: 1px solid var(--line); text-align: right; vertical-align: top; }
.enh-tool-out th:first-child, .enh-tool-out td:first-child { text-align: left; }
.enh-tool-out thead th { font: 650 .95rem var(--f-head); border-top: 0; }
.enh-tool-out td.is-best { font-weight: 700; color: #0E2038; background: #FFF4D6; }
.enh-tool-sum { margin: 1rem 0 .4rem; font-size: 1.05rem; line-height: 1.55; }
.enh-tool button { font: 650 .95rem var(--f-head); padding: .55rem 1rem; border: 0; border-radius: 4px; background: #0E2038; color: #fff; cursor: pointer; min-height: 2.6rem; }
.enh-tool button:hover { background: #17325A; }
.enh-tool-chart svg { width: 100%; height: auto; display: block; max-width: 40rem; }
.enh-tool-leg { display: flex; gap: 1.2rem; flex-wrap: wrap; font-size: .9rem; color: var(--muted); margin: .4rem 0 0; }
.enh-tool-leg i { display: inline-block; width: .8rem; height: .8rem; margin-right: .35rem; vertical-align: -1px; border-radius: 2px; }
@media (max-width: 36rem) { .enh-rankt th, .enh-rankt td { padding: .5rem .5rem; font-size: .92rem; } }

/* Selbstbau-Anleitungen */
.enh-sb { max-width: 56rem; }
.enh-sb > p, .enh-sb > ul, .enh-sb > ol, .enh-sb > h3 { max-width: var(--read); }
.enh-sb ol, .enh-sb ul { padding-left: 1.3rem; }
.enh-sb li { margin: 0 0 .55rem; }
.enh-sb h3 { margin: 1.8rem 0 .5rem; font-size: 1.2rem; }
.enh-sb .meta { color: var(--muted); font-size: .92rem; }
.enh-sb a.aff::after { content: "*"; margin-left: .05em; text-decoration: none; display: inline-block; }
.enh-sb-scroll { overflow-x: auto; margin: 1.2rem 0 1.5rem; }
.enh-sb-scroll:focus-visible { outline: 3px solid var(--sun); outline-offset: 2px; }
.enh-sb-scroll table, .enh-article > .enh-sb-scroll table { width: 100%; border-collapse: collapse; background: #fff; font-size: .95rem; min-width: 34rem; }
.enh-sb-scroll th, .enh-sb-scroll td { text-align: left; vertical-align: top; padding: .6rem .75rem; border: 1px solid var(--line); color: var(--ink); }
.enh-sb-scroll th { background: var(--night); color: #fff; font-family: var(--f-head); font-weight: 600; }
.enh-sb-box { border-left: 5px solid var(--sun); background: var(--sun-soft); padding: .9rem 1.1rem; margin: 1.4rem 0; max-width: var(--read); }
.enh-sb-stop { border-left-color: #A32A24; background: #FBEDEB; }
.enh-sb-soon div { padding: 1rem 0; }
.enh-sb-soon strong { display: block; font: 650 1.15rem var(--f-head); color: var(--ink); }
.enh-sb-soon span { color: var(--muted); }
.enh-sb-cta { margin: 2.4rem 0 0; padding: 1.1rem 1.25rem; background: var(--sun-soft); border-left: 5px solid var(--sun); max-width: var(--read); }
.enh-sb-cta h2 { margin: 0 0 .4rem; font-size: 1.2rem; }
.enh-sb-cta p { margin: 0 0 .6rem; }
.enh-sb-cta ul { margin: 0; padding-left: 1.2rem; }
