/* Neuauftritt "Mischung" — gilt auf allen Seiten, laedt nach components.css.
   Kopf, Seitenbaender und Fuss dunkel; Lesetext auf Papier. Rot = Korrekturstift. */

html { font-size: 17px; }
body { background: var(--color-background); overflow-x: clip; }

/* ---------- Buttons ---------- */
.btn {
  border-radius: 999px;
  font-family: var(--font-serif);
  font-weight: 800;
  font-stretch: 90%;
  letter-spacing: 0.01em;
  padding: 0.85rem 1.5rem;
  line-height: 1.1;
  text-align: center;
}
.btn-primary { background: var(--color-primary); color: #fff; font-family: var(--font-serif); }
.btn-primary:hover, .btn-primary:focus { background: var(--color-primary-hover); color: #fff; box-shadow: none; }
.btn-outline { border: 2px solid currentColor; color: var(--color-text); background: transparent; }
.btn-outline:hover, .btn-outline:focus { background: var(--color-text); border-color: var(--color-text); color: var(--color-background); }
.btn-secondary { background: var(--color-text); color: var(--color-background); }
.btn-secondary:hover, .btn-secondary:focus { background: var(--color-primary); color: #fff; }
.btn-large { padding: 1rem 1.9rem; font-size: 1.05rem; }

/* ---------- Kopf ---------- */
.site-header {
  background: var(--dark-bg);
  border-bottom: 1px solid var(--dark-line);
  color: var(--dark-text);
}
.site-header-inner { height: 72px; }
.site-logo {
  font-family: var(--font-serif);
  font-weight: 900;
  font-stretch: 62%;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  font-size: 1.6rem;
  color: var(--dark-text);
}
.site-logo::after { content: "."; color: var(--rot-hell); }
.site-logo:hover, .site-logo:focus { color: var(--dark-text); }
.nav-link {
  color: var(--dark-text);
  font-family: var(--font-serif);
  font-weight: 600;
  font-stretch: 88%;
  font-size: 1rem;
}
.nav-link:hover, .nav-link:focus, .submenu-toggle:hover, .submenu-toggle:focus { color: var(--rot-hell); }
.submenu-toggle { color: var(--dark-muted); }
.dropdown-menu { background: var(--dark-bg-2); border-color: var(--dark-line); box-shadow: 0 20px 40px -20px rgba(0,0,0,.6); }
.dropdown-link { color: var(--dark-text); }
.dropdown-link:hover, .dropdown-link:focus { background: var(--dark-line); color: #fff; }
.dropdown-link.view-all { border-top-color: var(--dark-line); color: var(--rot-hell); }
.mobile-menu-toggle { color: var(--dark-text); }
.header-cta { padding: 0.65rem 1.1rem; font-size: 0.9rem; }
@media (max-width: 991px) {
  .primary-navigation { top: 72px; background: var(--dark-bg-2); border-bottom-color: var(--dark-line); }
  .nav-item-wrapper { border-bottom-color: var(--dark-line); }
  .nav-list > li > .nav-link { border-bottom: 1px solid var(--dark-line); }
}

/* ---------- Seitenbaender (Titel jeder Unterseite) ---------- */
.overview-hero, .text-hero, .blog-hero, .form-hero,
.page-pricing > section:first-child, .page-courses > section:first-child {
  background: var(--dark-bg) !important;
  border-bottom: 0 !important;
  color: var(--dark-text);
  padding-block: clamp(3.5rem, 8vw, 6.5rem) !important;
  position: relative;
  overflow: hidden;
}
.overview-hero h1, .text-hero h1, .blog-hero h1, .form-hero h1,
.page-pricing > section:first-child h1, .page-courses > section:first-child h1,
.overview-hero h2, .page-courses > section:first-child h2 { color: var(--dark-text); }
.overview-hero p, .text-hero p, .blog-hero p, .form-hero p,
.page-pricing > section:first-child p, .page-courses > section:first-child p { color: var(--dark-muted) !important; margin-inline: auto; }

/* Detailseiten (Leistung, Fachbereich, Blog): der Kopf der Seite wird zum dunklen Band ueber die volle Breite */
.page-content { padding-top: 0; }
.page-content .page-header {
  position: relative;
  isolation: isolate;
  color: var(--dark-text);
  padding-block: clamp(3rem, 7vw, 5.5rem) clamp(2.5rem, 5vw, 4rem);
  margin-bottom: clamp(2rem, 5vw, 3.5rem);
}
.page-content .page-header::before {
  content: "";
  position: absolute;
  inset: 0 calc(50% - 50vw);
  background: var(--dark-bg);
  z-index: -1;
}
.page-content .page-header h1 { color: var(--dark-text); max-width: 18ch; }
.page-content .page-header .post-meta { color: var(--dark-muted); margin: 0.5rem 0 0; }

/* Rotstift unter jedem Seitentitel: handgezogener Strich */
.page-header h1::after, .overview-hero h1::after, .text-hero h1::after, .blog-hero h1::after, .form-hero h1::after,
.page-pricing > section:first-child h1::after, .page-courses > section:first-child h1::after {
  content: "";
  display: block;
  width: min(220px, 60%);
  height: 14px;
  margin-top: 0.9rem;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 220 14' preserveAspectRatio='none'%3E%3Cpath d='M3 9 C 50 3, 110 13, 160 6 S 205 5, 217 8' fill='none' stroke='%23EF4B32' stroke-width='4' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center / 100% 100%;
}
.overview-hero h1::after, .blog-hero h1::after, .page-pricing > section:first-child h1::after, .page-courses > section:first-child h1::after { margin-inline: auto; }

/* ---------- Lesetext ---------- */
.content-formatted, .rich-text { font-size: 1.06rem; line-height: 1.75; }
.content-formatted h2, .rich-text h2 { font-size: clamp(1.7rem, 3.4vw, 2.5rem); }
.content-formatted h3, .rich-text h3 { font-size: clamp(1.2rem, 2vw, 1.45rem); text-transform: none; }
.content-formatted a:not(.btn), .rich-text a:not(.btn) { color: var(--color-primary); text-decoration-thickness: 1px; }
.content-formatted blockquote {
  border-left: 3px solid var(--color-primary);
  padding: 0.4rem 0 0.4rem 1.2rem;
  margin: 1.5rem 0;
  font-family: var(--font-book);
  font-size: 1.35rem;
  line-height: 1.4;
}
.content-formatted img { border-radius: 14px; }
.content-formatted table { border-collapse: collapse; width: 100%; margin-bottom: 1.5rem; font-variant-numeric: tabular-nums; }
.content-formatted th, .content-formatted td { border-bottom: 1px solid var(--color-border); padding: 0.6rem 0.5rem; text-align: left; vertical-align: top; }

/* Verwandte Links als Kartenblock */
.related-links {
  background: var(--color-surface);
  border: 0;
  border-radius: 18px;
  padding: 1.5rem 1.75rem;
}
.related-links h2 { font-size: 1.35rem; font-stretch: 70%; }
.related-links ul { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.related-links li { padding: 0; }
.related-links a {
  display: inline-block;
  padding: 0.45rem 0.9rem;
  border-radius: 999px;
  background: var(--color-background);
  color: var(--color-text);
  text-decoration: none;
  font-weight: 600;
  font-size: 0.95rem;
}
.related-links a:hover, .related-links a:focus { background: var(--color-primary); color: #fff; }

/* ---------- Kacheln (Uebersichten, Blog) ---------- */
.overview-card, .page-blog .blog-grid a {
  background: #FFFDF9 !important;
  border: 1px solid var(--color-border) !important;
  border-radius: 18px !important;
  transition: transform .25s ease, border-color .25s ease !important;
}
.overview-card:hover, .overview-card:focus, .page-blog .blog-grid a:hover, .page-blog .blog-grid a:focus {
  transform: translateY(-3px);
  border-color: var(--color-primary) !important;
  box-shadow: none !important;
}
.overview-card h2, .page-blog .blog-grid h2 { text-transform: none; font-stretch: 80% !important; font-weight: 800; line-height: 1.1; }

/* ---------- Formulare ---------- */
.form-control, .page-form .form-control, .contact-form input:not([type="checkbox"]), .contact-form select, .contact-form textarea {
  width: 100%;
  padding: 0.8rem 0.95rem;
  border: 1px solid var(--color-border);
  border-radius: 12px;
  background: #FFFDF9;
  color: var(--color-text);
  font: 1rem/1.4 var(--font-sans);
}
.contact-form label { font-weight: 600; font-size: 0.9rem; }
.contact-form input[type="checkbox"] { accent-color: var(--color-primary); width: 18px; height: 18px; flex: 0 0 18px; }
.contact-form .btn { width: 100%; }

/* ---------- Preise (Startseite, /preise/) ---------- */
.pricing-card { background: #FFFDF9; border: 1px solid var(--color-border); border-radius: 18px; box-shadow: none; }
.pricing-card:hover { transform: none; }
.pricing-title { font-family: var(--font-serif); font-weight: 900; font-stretch: 70%; text-transform: uppercase; font-size: 1.5rem; }
.pricing-price { font-family: var(--font-serif); font-weight: 900; font-stretch: 62%; font-size: 3.4rem; line-height: 1; color: var(--color-primary); }
.pricing-grid .pricing-card:first-child .pricing-price { font-size: 1.1rem; font-stretch: 90%; color: var(--color-text-muted); line-height: 3.4rem; }

/* ---------- Kurse (Startseite und /kurse/) ---------- */
.course-price { font-family: var(--font-serif); font-weight: 900; font-stretch: 70%; font-size: 2.2rem; }
.courses-intro { max-width: none; }
.courses-intro .responsive-grid-2 { gap: 2rem; }
.courses-intro h3 { font-size: 1.5rem; font-stretch: 80%; }
.courses-intro p, .courses-learnings li { color: var(--color-text-muted); }
.courses-stack { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.course-card-horizontal { display: grid; grid-template-columns: 1.1fr 0.9fr; background: #FFFDF9; border: 2px solid var(--color-text); border-radius: 24px; overflow: hidden; min-width: 0; }
.course-content-left { padding: 1.75rem; display: flex; flex-direction: column; gap: 0.5rem; min-width: 0; }
.course-content-left h3 { font-size: 1.9rem; font-stretch: 72%; text-transform: uppercase; margin: 0; }
.course-content-left p { color: var(--color-text-muted); margin: 0; }
.course-features { list-style: none; padding: 0; margin: 0.5rem 0; display: grid; gap: 0.25rem; font-size: 0.92rem; }
.course-content-left .course-price { text-align: left; margin: auto 0 0.5rem; color: var(--color-primary); }
.course-content-left .btn { align-self: flex-start; }
.course-image-right { background: var(--color-surface); }
.course-image-right .course-image { width: 100%; height: 100%; object-fit: cover; aspect-ratio: auto; }

@media (max-width: 1199px) { .courses-stack { grid-template-columns: 1fr; } }
@media (max-width: 640px) { .course-card-horizontal { grid-template-columns: 1fr; } .course-image-right { max-height: 260px; overflow: hidden; } }

/* ---------- Preistabelle auf /preise/ (aus der alten home.css uebernommen) ---------- */

/* Pricing Grid */

.page-pricing .pricing-container-wrapper {
  max-width: 900px;
  margin: 0 auto;
  /* Am Handy scrollt die Tabelle im Wrapper, statt aus dem Layout zu brechen */
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}


.page-pricing .pricing-scroll-hint {
  display: none;
}

@media (max-width: 767px) {
  
.page-pricing .pricing-scroll-hint {
    display: block;
    text-align: center;
    font-size: var(--font-size-sm);
    color: var(--color-text-muted, #666);
    margin-bottom: 0.5rem;
  }
}


.page-pricing .pricing-grid {
  display: flex;
  flex-direction: row;
  min-width: 600px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
}


.page-pricing .pricing-card {
  flex: 1;
  background: #fff;
  padding: 0;
  text-align: center;
  box-shadow: none;
  border-right: 1px solid var(--color-border);
  border-radius: 0;
}

.page-pricing .pricing-card:last-child {
  border-right: none;
}


.page-pricing .pricing-card-header {
  background-color: var(--color-primary); /* burgundy */
  color: #fff;
  padding: 1.5rem 1rem;
}


.page-pricing .pricing-title {
  font-size: var(--font-size-lg);
  color: #fff;
  font-weight: 600;
  font-family: var(--font-serif);
}


.page-pricing .pricing-price {
  font-size: var(--font-size-2xl);
  font-weight: bold;
  color: #000;
  padding: 1.5rem 0;
  border-bottom: 1px solid var(--color-border);
  background: #fff;
}


.page-pricing .pricing-features {
  list-style: none;
  padding: 0;
  margin: 0;
  font-size: var(--font-size-sm);
}


.page-pricing .pricing-features li {
  padding: 1rem 0.5rem;
  border-bottom: 1px solid var(--color-border);
  overflow-wrap: break-word;
  hyphens: auto;
}


.page-pricing .pricing-features li:nth-child(even) {
  background-color: #f9f9f9;
}

.page-pricing .pricing-features li:nth-child(odd) {
  background-color: #fff;
}

/* Courses */


/* ---------- Fuss ---------- */
.site-footer { background: var(--dark-bg); border-top: 6px solid var(--rot-hell); padding-top: 5rem; }
.footer-col .footer-heading { font-stretch: 70%; text-transform: uppercase; font-size: 1.15rem; color: var(--dark-text); }
.footer-col p, .footer-nav a { color: var(--dark-muted); }
.footer-nav a:hover, .footer-nav a:focus, .footer-link-button:hover, .footer-link-button:focus { color: #fff; }
.site-footer .btn-primary { background: var(--rot-hell) !important; color: #17110E !important; }
.footer-bottom { border-top-color: var(--dark-line); color: var(--dark-muted); }

/* ---------- Cookie-Leiste ---------- */
.cookie-consent { background: rgba(23, 17, 14, 0.97); border-top: 1px solid var(--dark-line); color: var(--dark-text); }
.cookie-consent-copy strong { font-family: var(--font-serif); font-stretch: 80%; color: var(--dark-text); }
.cookie-consent-copy p { color: var(--dark-muted); }
.cookie-consent a { color: var(--dark-text); }
.btn.cookie-consent-reject { color: var(--dark-text); border-color: var(--dark-muted); }

/* ---------- Hilfsklassen, die auch Unterseiten nutzen ---------- */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.bewegung-aus .home-marquee .marquee-spur { animation-play-state: paused; }
.text-center { text-align: center; }
.mt-4 { margin-top: var(--spacing-4); }
.mt-6 { margin-top: var(--spacing-6); }
.mt-8 { margin-top: var(--spacing-8); }
.mb-8 { margin-bottom: var(--spacing-8); }

/* Rotstift (Startseite und Beispielblatt): wird von main.js gezeichnet */
.rotstift-ebene { position: absolute; inset: 0; pointer-events: none; }
.rotstift-ebene svg { position: absolute; overflow: visible; }
.rotstift-ebene path { fill: none; stroke: var(--rot-hell); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.rotstift-ebene .notiz {
  position: absolute;
  font: 700 clamp(1.1rem, 1.6vw, 1.35rem)/1 var(--font-hand);
  color: var(--rot-hell);
  white-space: nowrap;
  transform: rotate(-4deg);
  transform-origin: left bottom;
}
.rotstift-ebene path { stroke-dasharray: var(--len); stroke-dashoffset: 0; }
.rotstift-ebene.wartet path { stroke-dashoffset: var(--len); }
.rotstift-ebene.wartet .notiz { opacity: 0; transform: rotate(-4deg) translateY(4px); }
.rotstift-ebene path { transition: stroke-dashoffset .6s ease-in-out; transition-delay: var(--d, 0s); }
.rotstift-ebene .notiz { transition: opacity .3s ease, transform .3s ease; transition-delay: var(--d, 0s); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}

/* Titel in den Baendern gross, lange Woerter passen sich der Breite an (--lw setzt der Build) */
.page-header h1, .overview-hero h1, .text-hero h1, .blog-hero h1, .form-hero h1,
.page-pricing > section:first-child h1, .page-courses > section:first-child h1 {
  font-size: clamp(2.4rem, 6vw, 4.8rem) !important;
  line-height: 0.95;
}
.page-header h1.lange-woerter, .overview-hero h1.lange-woerter, .text-hero h1.lange-woerter, .blog-hero h1.lange-woerter, .form-hero h1.lange-woerter,
.page-pricing > section:first-child h1.lange-woerter, .page-courses > section:first-child h1.lange-woerter {
  font-size: min(clamp(2.4rem, 6vw, 4.8rem), calc((100vw - 2.5rem) / var(--lw))) !important;
}

/* ---------- Anfrage-Kasten auf Unterseiten ---------- */
.anfrage-kasten {
  background: var(--dark-bg);
  color: var(--dark-text);
  border-radius: 24px;
  padding: clamp(1.5rem, 4vw, 2.5rem);
  margin: 3rem 0 2rem;
  max-width: 800px;
}
.anfrage-kasten-titel {
  font: 900 clamp(2rem, 5vw, 3.2rem)/0.95 var(--font-serif);
  font-stretch: 64%;
  text-transform: uppercase;
  color: var(--dark-text);
  margin: 0 0 1.25rem;
}
.anfrage-kasten-titel span { color: var(--rot-hell); }
.anfrage-kasten ul { list-style: none; padding: 0; margin: 0 0 1.5rem; display: flex; flex-wrap: wrap; gap: 0.5rem; }
.anfrage-kasten li { border: 1px solid rgba(244,235,223,.28); border-radius: 999px; padding: 0.35rem 0.85rem; font-size: 0.92rem; }
.anfrage-kasten-aktion { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem 1.25rem; }
.anfrage-kasten .btn-primary { background: var(--rot-hell); color: #17110E; }
.anfrage-kasten .btn-primary:hover, .anfrage-kasten .btn-primary:focus { background: #fff; color: #17110E; }
.anfrage-kasten-preise { color: var(--dark-text); text-decoration: underline; text-underline-offset: 0.2em; }
.anfrage-kasten-fuss { color: var(--dark-muted); font-size: 0.9rem; margin: 1rem 0 0; }
.anfrage-kasten.kurz {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem 1.5rem;
  background: var(--color-surface);
  color: var(--color-text);
  border-left: 4px solid var(--color-primary);
  border-radius: 16px;
  padding: 1.25rem 1.5rem;
  margin: 2.5rem 0;
}
.anfrage-kasten.kurz p { margin: 0; flex: 1 1 22rem; color: var(--color-text); }
.anfrage-kasten.kurz .btn-primary { background: var(--color-primary); color: #fff; }

/* ---------- Funde Bug-Tester 25.10.: kleine Handys, Tippflaechen ---------- */
/* 360 px: Logo, Anfragen und Menue-Knopf muessen nebeneinander passen */
@media (max-width: 400px) {
  .site-header-inner { gap: 0.5rem; }
  .site-logo { font-size: 1.3rem; }
  .header-cta { padding: 0.55rem 0.85rem; font-size: 0.85rem; }
}
/* Untermenue-Pfeile am Desktop: mindestens 28 x 28 px zum Antippen (WCAG 2.5.8) */
@media (min-width: 992px) {
  .submenu-toggle { min-width: 28px; min-height: 28px; }
}
/* sr-only-Texte am Platz halten: sonst haengen sie am Seitenrand und machen die Seite breiter */
:where(td, th, li):has(> .sr-only) { position: relative; }

/* Hub-Texte (P3): Lesebreite wie auf den Detailseiten, Abstand zu den Kacheln */
.hub-text { max-width: 760px; margin: 0 auto clamp(2.5rem, 6vw, 4rem); }
.hub-text h2 { margin-top: 2.2rem; }
.hub-text h2:first-child { margin-top: 0; }

/* ---------- Seitenrechner ---------- */
.rechner { background: var(--dark-bg); color: var(--dark-text); border-radius: 18px; padding: clamp(1.25rem, 4vw, 2.25rem); margin-block: 2rem; display: grid; gap: 1.5rem; }
.rechner-eingabe { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 1rem; }
.rechner-feld { display: grid; gap: 0.4rem; font-weight: 600; font-size: 0.95rem; }
.rechner-feld input, .rechner-feld select { width: 100%; min-width: 0; font: inherit; font-size: 1.1rem; padding: 0.7rem 0.85rem; border-radius: 10px; border: 1px solid var(--dark-line); background: var(--dark-bg-2); color: var(--dark-text); }
.rechner-ergebnis { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 0.75rem; }
.rechner-wert { background: var(--dark-bg-2); border: 1px solid var(--dark-line); border-radius: 12px; padding: 1rem; display: grid; gap: 0.25rem; }
.rechner-wert b { font: 900 clamp(1.8rem, 5vw, 2.6rem)/1 var(--font-serif); font-stretch: 68%; }
.rechner-wert span { color: var(--dark-muted); font-size: 0.9rem; }
.rechner-wert-akuna { border-color: var(--rot-hell); }
.rechner-wert-akuna b { color: var(--rot-hell); }
.rechner-preis { margin: 0; color: var(--dark-text); }
.rechner-hinweis { font-size: 0.92rem; color: var(--color-text-muted); }
.rechner-feld[hidden] { display: none; }
.planer-liste { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.5rem; counter-reset: phase; }
.planer-liste li { background: var(--dark-bg-2); border: 1px solid var(--dark-line); border-radius: 10px; padding: 0.75rem 1rem; display: flex; flex-wrap: wrap; gap: 0.25rem 1rem; align-items: baseline; }
.planer-liste li b { font-family: var(--font-serif); font-stretch: 80%; color: var(--rot-hell); min-width: 9.5rem; }
.planer-liste li.vorbei { opacity: 0.6; }
.planer-liste li:last-child { border-color: var(--rot-hell); }

/* ---------- Beispielrechnung auf Leistungsseiten ---------- */
.preisbeispiel { margin-block: 3rem; }
.preisbeispiel-tabelle { overflow-x: auto; margin-block: 1.25rem; }
.preisbeispiel table { width: 100%; border-collapse: collapse; min-width: 420px; }
.preisbeispiel th, .preisbeispiel td { text-align: left; padding: 0.8rem 0.9rem; border-bottom: 1px solid var(--color-border); }
.preisbeispiel thead th { font-size: 0.85rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--color-text-muted); }
.preisbeispiel tbody th { font-family: var(--font-serif); font-weight: 900; font-stretch: 80%; font-size: 1.15rem; }
.preisbeispiel tbody td:nth-child(3) { font-weight: 700; }
.preisbeispiel-links { font-size: 0.95rem; color: var(--color-text-muted); }

/* ---------- Gliederungsvorlagen ---------- */
.vorlage-sprung { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-block: 1.5rem; }
.vorlage-sprung a { border: 1px solid var(--color-border); border-radius: 999px; padding: 0.4rem 0.9rem; text-decoration: none; font-weight: 600; font-size: 0.95rem; }
.vorlage { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: 16px; padding: clamp(1.1rem, 3vw, 2rem); margin-block: 2rem; scroll-margin-top: 100px; }
.vorlage h2 { margin-top: 0; }
.vorlage-liste { list-style: none; padding: 0; margin: 1rem 0 1.25rem; font-family: var(--font-sans); }
.vorlage-liste li { padding-block: 0.2rem; border-bottom: 1px dashed var(--color-border); }
.vorlage-liste .ebene-0 { font-weight: 700; padding-top: 0.6rem; }
.vorlage-liste .ebene-1 { padding-left: 1.4rem; }
.vorlage-liste .ebene-2 { padding-left: 2.8rem; }
.vorlage-status { margin-left: 0.75rem; font-size: 0.92rem; color: var(--color-text-muted); }
.content-formatted .vorlage-liste li { margin: 0; line-height: 1.5; }

/* ---------- Zitierregeln ---------- */
.zitier-tabelle { overflow-x: auto; margin-block: 1.25rem 2rem; }
.zitier-tabelle table { width: 100%; min-width: 560px; border-collapse: collapse; font-size: 0.95rem; }
.zitier-tabelle caption { text-align: left; font-weight: 700; padding-bottom: 0.5rem; }
.zitier-tabelle th, .zitier-tabelle td { text-align: left; vertical-align: top; padding: 0.7rem 0.75rem; border-bottom: 1px solid var(--color-border); }
.zitier-tabelle thead th { font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--color-text-muted); }
.zitier-tabelle tbody th { white-space: nowrap; }