:root {
  --accent: #0a5c50;
  --accent-dark: #07443b;
  --accent-light: #e6f2f0;
  --neon: #00f29b;
  --ink: #1e2927;
  --ink-soft: #4a5d59;
  --bg: #ffffff;
  --bg-soft: #f4f7f6;
  --border: rgba(10, 92, 80, 0.08);
  --error: #b3261e;
  --error-bg: #fdeceb;
  --warn: #8a6d00;
  --warn-bg: #fdf6e3;
  --ok: #1a7a3c;
  --ok-bg: #e9f6ee;
  --radius: 16px;
}

* { margin: 0; padding: 0; box-sizing: border-box; }

body {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  color: var(--ink);
  background: var(--bg);
  line-height: 1.6;
  position: relative;
  overflow-x: hidden;
}

/* Background Grids and Orbs */
.grid-bg {
  position: absolute;
  top: 0; left: 0; right: 0; height: 1100px;
  background-image: radial-gradient(rgba(10, 92, 80, 0.06) 1px, transparent 1px);
  background-size: 24px 24px;
  mask-image: linear-gradient(180deg, white, transparent 95%);
  pointer-events: none;
  z-index: -2;
  opacity: 0.8;
}

.glow-orb-1 {
  position: absolute;
  top: -120px; left: 8%; width: 450px; height: 450px;
  background: radial-gradient(circle, rgba(0, 242, 155, 0.12) 0%, transparent 70%);
  filter: blur(60px);
  pointer-events: none;
  z-index: -1;
  animation: float-orb 25s ease-in-out infinite alternate;
}

.glow-orb-2 {
  position: absolute;
  top: 200px; right: 8%; width: 500px; height: 500px;
  background: radial-gradient(circle, rgba(10, 92, 80, 0.08) 0%, transparent 70%);
  filter: blur(70px);
  pointer-events: none;
  z-index: -1;
  animation: float-orb 30s ease-in-out infinite alternate-reverse;
}

@keyframes float-orb {
  0% { transform: translateY(0) scale(1); }
  100% { transform: translateY(40px) scale(1.1); }
}

.container { max-width: 960px; margin: 0 auto; padding: 0 24px; }

h1 { font-size: clamp(2.2rem, 5.5vw, 3.4rem); line-height: 1.1; letter-spacing: -0.03em; font-weight: 800; }
h2 { font-size: clamp(1.6rem, 3.5vw, 2.2rem); margin-bottom: 12px; letter-spacing: -0.02em; font-weight: 700; }
h3 { font-size: 1.25rem; margin-bottom: 8px; font-weight: 700; }

/* Header */
.site-header {
  border-bottom: 1px solid var(--border);
  position: sticky; top: 0; background: rgba(255, 255, 255, 0.8);
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); z-index: 10;
}
.header-inner { display: flex; align-items: center; justify-content: space-between; height: 64px; }
.logo {
  font-size: 1.3rem;
  font-weight: 800;
  color: var(--ink);
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 8px;
}
.logo span { color: var(--accent); }
.logo-img {
  width: 28px;
  height: 28px;
  object-fit: contain;
  flex-shrink: 0;
}
nav a { margin-left: 20px; text-decoration: none; color: var(--ink-soft); font-size: 0.95rem; font-weight: 500; transition: color 0.15s; }
nav a:hover { color: var(--accent); }
nav .nav-cta {
  color: #fff; background: var(--accent); padding: 8px 16px; border-radius: 30px;
  box-shadow: 0 4px 12px rgba(10, 92, 80, 0.15); transition: all 0.2s;
}
nav .nav-cta:hover { background: var(--accent-dark); color: #fff; transform: translateY(-1px); }

/* Hero */
.hero { padding: 90px 0 64px; text-align: center; position: relative; background: transparent; }
.hero h1 {
  background: linear-gradient(135deg, var(--ink) 30%, var(--accent) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.hero-sub { max-width: 660px; margin: 20px auto 0; font-size: 1.2rem; color: var(--ink-soft); font-weight: 400; }

.countdown-box {
  margin: 32px auto 28px;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  background: rgba(255, 255, 255, 0.7);
  border: 1px solid var(--border);
  padding: 12px 24px;
  border-radius: 50px;
  backdrop-filter: blur(10px);
  box-shadow: 0 4px 20px rgba(10, 92, 80, 0.03);
}
.countdown-label { font-size: 0.75rem; color: var(--ink-soft); text-transform: uppercase; letter-spacing: 0.08em; font-weight: 700; }
.countdown { font-size: clamp(1.2rem, 3vw, 1.45rem); font-weight: 800; color: var(--accent); font-variant-numeric: tabular-nums; }

.btn-primary {
  display: inline-block; background: var(--accent); color: #fff; text-decoration: none;
  padding: 16px 32px; border-radius: 30px; font-weight: 600; font-size: 1.05rem;
  border: none; cursor: pointer; box-shadow: 0 4px 16px rgba(10, 92, 80, 0.15);
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}
.btn-primary:hover { background: var(--accent-dark); transform: translateY(-2px); box-shadow: 0 6px 20px rgba(10, 92, 80, 0.25); }
.btn-primary:active { transform: translateY(0); }

.btn-secondary {
  background: #fff; border: 1px solid var(--border); color: var(--ink-soft);
  padding: 12px 24px; border-radius: 30px; font-size: 0.95rem; font-weight: 500; cursor: pointer;
  box-shadow: 0 2px 8px rgba(0,0,0,0.01); transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}
.btn-secondary:hover { border-color: var(--accent); color: var(--accent); transform: translateY(-1px); box-shadow: 0 4px 12px rgba(10, 92, 80, 0.05); }

/* Validator */
.validator-section { padding: 80px 0; }
.section-sub { color: var(--ink-soft); margin-bottom: 28px; }
.dropzone {
  border: 2px dashed var(--border); border-radius: 20px;
  background: rgba(255, 255, 255, 0.6); cursor: pointer;
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  box-shadow: 0 8px 32px rgba(10, 92, 80, 0.02);
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}
.dropzone:hover, .dropzone.dragover {
  border-color: var(--accent); background: rgba(10, 92, 80, 0.04);
  transform: translateY(-3px); box-shadow: 0 16px 40px rgba(10, 92, 80, 0.06);
}
.dropzone-inner { padding: 56px 20px; text-align: center; }
.dropzone-icon { font-size: 2.8rem; margin-bottom: 12px; display: inline-block; transition: transform 0.25s; }
.dropzone:hover .dropzone-icon { transform: scale(1.15) rotate(-5deg); }
.dropzone-hint { font-size: 0.85rem; color: var(--ink-soft); margin-top: 6px; }
.validator-actions { margin-top: 18px; text-align: center; }

/* Report */
.report { margin-top: 32px; border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; box-shadow: 0 4px 16px rgba(0,0,0,0.02); }
.report-header { padding: 18px 22px; font-weight: 700; font-size: 1.15rem; }
.report-header.ok { background: var(--ok-bg); color: var(--ok); }
.report-header.warn { background: var(--warn-bg); color: var(--warn); }
.report-header.fail { background: var(--error-bg); color: var(--error); }
.report-meta {
  padding: 14px 22px; border-bottom: 1px solid var(--border); background: var(--bg-soft);
  display: flex; flex-wrap: wrap; gap: 8px 28px; font-size: 0.92rem;
}
.report-meta strong { color: var(--ink); }
.report ul { list-style: none; }
.report li { padding: 12px 22px; border-top: 1px solid var(--border); font-size: 0.95rem; display: flex; gap: 10px; }
.report li .badge { flex-shrink: 0; font-size: 0.75rem; font-weight: 700; padding: 2px 8px; border-radius: 20px; height: fit-content; margin-top: 2px; }
.badge.error { background: var(--error-bg); color: var(--error); }
.badge.warn { background: var(--warn-bg); color: var(--warn); }
.badge.ok { background: var(--ok-bg); color: var(--ok); }
.rule-id { color: var(--ink-soft); font-size: 0.8rem; display: block; margin-top: 2px; }
.xml-hint {
  margin-top: 8px; padding: 10px 12px; border: 1px solid var(--border);
  border-radius: 8px; background: var(--bg-soft); color: var(--ink-soft);
  font-size: 0.85rem; line-height: 1.45;
}
.xml-hint code {
  font-family: "SFMono-Regular", Consolas, monospace; color: var(--accent);
  background: rgba(10, 92, 80, 0.08); padding: 1px 5px; border-radius: 4px;
}
.xml-hint pre {
  margin-top: 8px; white-space: pre-wrap; word-break: break-word;
  font-family: "SFMono-Regular", Consolas, monospace; font-size: 0.78rem;
}
.disclaimer { margin-top: 24px; font-size: 0.85rem; color: var(--ink-soft); line-height: 1.5; }

/* Timeline */
.timeline-section { padding: 80px 0; background: var(--bg-soft); }
.timeline { margin-top: 32px; display: grid; gap: 18px; }
.timeline-item {
  background: #fff; border: 1px solid var(--border); border-radius: var(--radius);
  padding: 24px 28px; display: grid; grid-template-columns: 180px 1fr; gap: 24px; align-items: start;
  box-shadow: 0 4px 16px rgba(0,0,0,0.01); transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}
.timeline-item:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(0,0,0,0.02); }
.timeline-item.done { opacity: 0.65; background: rgba(255, 255, 255, 0.5); }
.timeline-item.next {
  border-color: var(--accent); box-shadow: 0 8px 32px rgba(10, 92, 80, 0.06);
  position: relative; overflow: hidden;
}
.timeline-item.next::before {
  content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--accent);
}
.timeline-date { font-weight: 800; color: var(--accent); display: flex; align-items: center; gap: 8px; }
.timeline-item.next .timeline-date::after {
  content: ''; display: inline-block; width: 8px; height: 8px; background: var(--accent); border-radius: 50%;
  animation: pulse-ring 1.5s infinite;
}
@keyframes pulse-ring {
  0% { transform: scale(1); opacity: 1; box-shadow: 0 0 0 0 rgba(10, 92, 80, 0.4); }
  70% { transform: scale(1.1); opacity: 0.5; box-shadow: 0 0 0 8px rgba(10, 92, 80, 0); }
  100% { transform: scale(1); opacity: 1; box-shadow: 0 0 0 0 rgba(10, 92, 80, 0); }
}
.timeline-note { margin-top: 24px; font-size: 0.9rem; color: var(--ink-soft); line-height: 1.6; }

/* Privacy columns */
.privacy-section { padding: 80px 0; }
.privacy-section .col {
  background: #fff; border: 1px solid var(--border); border-radius: var(--radius);
  padding: 32px 28px; box-shadow: 0 4px 16px rgba(0,0,0,0.01);
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}
.privacy-section .col:hover {
  transform: translateY(-4px); border-color: var(--accent);
  box-shadow: 0 12px 32px rgba(10, 92, 80, 0.05);
}
.privacy-section .col h3 { font-size: 1.2rem; font-weight: 700; margin-bottom: 10px; color: var(--ink); display: flex; align-items: center; gap: 8px; }
.three-cols { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
.three-cols p { color: var(--ink-soft); font-size: 0.95rem; line-height: 1.6; }

/* FAQ */
.faq-section { padding: 80px 0; background: var(--bg-soft); }
.faq-section details {
  background: #fff; border: 1px solid var(--border); border-radius: var(--radius);
  margin-top: 12px; padding: 18px 24px; box-shadow: 0 2px 8px rgba(0,0,0,0.01);
  transition: all 0.2s;
}
.faq-section details:hover { border-color: var(--accent); box-shadow: 0 6px 16px rgba(10, 92, 80, 0.03); }
.faq-section summary { font-weight: 600; cursor: pointer; font-size: 1.05rem; }
.faq-section details p { margin-top: 12px; color: var(--ink-soft); line-height: 1.6; }

/* API Terminal */
.api-section { padding: 80px 0; text-align: center; }
.api-section p { max-width: 640px; margin: 16px auto 28px; color: var(--ink-soft); font-size: 1.05rem; }
.terminal-window {
  max-width: 680px; margin: 32px auto 28px; background: #0c1412;
  border-radius: 12px; box-shadow: 0 16px 48px rgba(0, 0, 0, 0.22);
  overflow: hidden; border: 1px solid rgba(255, 255, 255, 0.05);
}
.terminal-header {
  background: #141d1b; padding: 12px 18px; display: flex; align-items: center;
  border-bottom: 1px solid rgba(255, 255, 255, 0.04);
}
.terminal-dots { display: flex; gap: 6px; }
.terminal-dot { width: 12px; height: 12px; border-radius: 50%; }
.terminal-dot.red { background: #ff5f56; }
.terminal-dot.yellow { background: #ffbd2e; }
.terminal-dot.green { background: #27c93f; }
.terminal-title { color: #738480; font-size: 0.8rem; margin-left: 20px; font-weight: 500; font-family: monospace; }
.terminal-tabs { margin-left: auto; display: flex; gap: 8px; }
.terminal-tab {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: #738480;
  font-size: 0.7rem;
  padding: 3px 10px;
  border-radius: 4px;
  cursor: pointer;
  font-family: inherit;
  transition: all 0.15s;
}
.terminal-tab:hover {
  background: rgba(255, 255, 255, 0.1);
  color: #ccc;
}
.terminal-tab.active {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}
.code-sample {
  margin: 0; width: 100%; border-radius: 0; background: transparent; color: #8eeedc;
  padding: 20px 24px; font-family: "Cascadia Code", Consolas, Menlo, monospace;
  font-size: 0.9rem; line-height: 1.5; overflow-x: auto; text-align: left;
}
.code-keyword { color: #f97583; }
.code-method { color: #b392f0; }
.code-url { color: #9ecbff; }
.code-comment { color: #6a737d; }

/* Footer */
.site-footer { border-top: 1px solid var(--border); padding: 40px 0; text-align: center; background: #fff; }
.footer-small { font-size: 0.8rem; color: var(--ink-soft); margin-top: 8px; line-height: 1.6; }
.footer-small a { color: var(--ink-soft); text-decoration: none; }
.footer-small a:hover { color: var(--accent); text-decoration: underline; }

/* Ratgeber / Artikel Teaser */
.article { padding: 56px 0 72px; }
.article .container { max-width: 760px; }
.article-meta { color: var(--ink-soft); font-size: 0.9rem; margin: 10px 0 28px; }
.article h2 { margin-top: 36px; }
.article p, .article li { color: var(--ink); margin-top: 12px; }
.article ul, .article ol { padding-left: 24px; }
.article table { width: 100%; border-collapse: collapse; margin-top: 16px; font-size: 0.95rem; }
.article th, .article td { border: 1px solid var(--border); padding: 10px 12px; text-align: left; vertical-align: top; }
.article th { background: var(--bg-soft); }
.article .logo { text-decoration: none; }
.cta-box {
  margin-top: 40px; padding: 24px 28px; background: var(--accent-light);
  border: 1px solid var(--accent); border-radius: var(--radius);
}
.cta-box p { margin-top: 0; }
.cta-box .btn-primary { margin-top: 14px; }
.article-list { display: grid; gap: 16px; margin-top: 8px; }
.article-card {
  display: block; background: #fff; border: 1px solid var(--border);
  border-radius: var(--radius); padding: 24px; text-decoration: none; color: var(--ink);
  transition: all 0.2s; box-shadow: 0 2px 8px rgba(0,0,0,0.01);
}
.article-card:hover { border-color: var(--accent); transform: translateY(-2px); box-shadow: 0 8px 24px rgba(10, 92, 80, 0.04); }
.article-card h2 { margin: 0; font-size: 1.25rem; font-weight: 700; }
.article-card p { color: var(--ink-soft); font-size: 0.95rem; margin-top: 8px; }
.hinweis {
  background: var(--warn-bg); border-left: 4px solid var(--warn);
  padding: 12px 18px; border-radius: 0 8px 8px 0; margin-top: 16px; font-size: 0.95rem;
}

/* Generator */
.beta-tag {
  font-size: 0.7em; background: var(--accent-light); color: var(--accent);
  border: 1px solid var(--accent); border-radius: 20px; padding: 2px 10px;
  vertical-align: middle; font-weight: 600; margin-left: 8px;
}
.gen-form { margin-top: 28px; }
.template-tools {
  margin-top: 24px; padding: 18px 20px; background: #fff;
  border: 1px solid var(--border); border-radius: var(--radius);
  display: grid; grid-template-columns: 1fr auto; gap: 14px 20px; align-items: center;
}
.template-tools strong { display: block; color: var(--ink); margin-bottom: 4px; }
.template-tools p { margin: 0; color: var(--ink-soft); font-size: 0.9rem; line-height: 1.45; }
.template-actions { display: flex; gap: 10px; flex-wrap: wrap; justify-content: flex-end; }
.template-status {
  grid-column: 1 / -1; padding-top: 2px; color: var(--accent);
  font-size: 0.85rem; font-weight: 600;
}
.template-status.error { color: var(--error); }
.gen-form fieldset {
  border: 1px solid var(--border); border-radius: var(--radius);
  padding: 24px 28px; margin-top: 20px; background: #fff; box-shadow: 0 4px 16px rgba(0,0,0,0.01);
}
.gen-form legend { font-weight: 700; padding: 0 10px; color: var(--accent); font-size: 1.05rem; }
.form-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px 20px; }
.gen-form label { display: block; font-size: 0.85rem; font-weight: 600; color: var(--ink-soft); }
.gen-form label.full-width { margin-top: 14px; }
.gen-form input, .gen-form select {
  display: block; width: 100%; margin-top: 6px; padding: 10px 14px;
  border: 1px solid var(--border); border-radius: 8px; font-size: 0.95rem;
  font-family: inherit; color: var(--ink); background: #fff; box-sizing: border-box;
  transition: all 0.15s;
}
.gen-form input:focus, .gen-form select:focus { outline: 2px solid var(--accent); outline-offset: -1px; border-color: var(--accent); box-shadow: 0 0 0 4px rgba(10, 92, 80, 0.08); }
.form-hint { font-size: 0.8rem; color: var(--ink-soft); margin-top: 12px; }
.lines-table { width: 100%; border-collapse: collapse; margin-bottom: 12px; }
.lines-table th { text-align: left; font-size: 0.8rem; color: var(--ink-soft); padding: 6px; }
.lines-table td { padding: 6px; vertical-align: middle; }
.lines-table .l-total { font-variant-numeric: tabular-nums; white-space: nowrap; font-size: 0.9rem; }
.lines-table .l-remove {
  background: none; border: none; color: var(--ink-soft); cursor: pointer; font-size: 1.1rem; padding: 4px; transition: color 0.15s;
}
.lines-table .l-remove:hover { color: var(--error); }
.totals { margin-top: 20px; margin-left: auto; max-width: 320px; }
.totals div { display: flex; justify-content: space-between; padding: 6px 0; font-size: 0.95rem; }
.totals .totals-gross { border-top: 2px solid var(--ink); margin-top: 6px; padding-top: 10px; font-size: 1.1rem; font-weight: 700; }
.gen-actions { margin-top: 28px; text-align: center; }
.download-area {
  margin-top: 28px; padding: 24px 28px; text-align: center;
  background: var(--ok-bg); border: 1px solid var(--ok); border-radius: var(--radius);
}
.download-area .btn-primary { margin-top: 10px; }

@media (max-width: 720px) {
  .form-grid { grid-template-columns: 1fr; }
  .template-tools { grid-template-columns: 1fr; }
  .template-actions { justify-content: stretch; }
  .template-actions .btn-secondary { flex: 1 1 180px; }
  .lines-table thead { display: none; }
  .lines-table tr { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; border-bottom: 1px solid var(--border); padding: 10px 0; }
  .lines-table td:first-child { grid-column: 1 / -1; }
}

@media (max-width: 720px) {
  .three-cols { grid-template-columns: 1fr; gap: 16px; }
  .timeline-item { grid-template-columns: 1fr; gap: 8px; }
  .logo { font-size: 1.1rem; }
  nav a { margin-left: 8px; font-size: 0.8rem; }
  nav .nav-cta { padding: 6px 12px; }
  .hero { padding: 64px 0 40px; }
  .btn-primary { width: 100%; text-align: center; }
}

/* Preview Modal & Print Styles */
.preview-modal {
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0, 0, 0, 0.45);
  backdrop-filter: blur(4px);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 1000;
  padding: 20px;
}
.preview-modal.show {
  display: flex;
}
.preview-modal-content {
  background: #fff;
  border-radius: var(--radius);
  width: 100%;
  max-width: 820px;
  height: 90vh;
  display: flex;
  flex-direction: column;
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.15);
  animation: modal-enter 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}
@keyframes modal-enter {
  from { transform: translateY(20px); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}
.preview-modal-header {
  padding: 16px 24px;
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.preview-modal-header h3 { margin: 0; font-size: 1.2rem; font-weight: 700; color: var(--ink); }
.btn-close {
  background: none; border: none; font-size: 1.5rem; cursor: pointer; color: var(--ink-soft);
  line-height: 1; padding: 4px; transition: color 0.15s;
}
.btn-close:hover { color: var(--ink); }
.preview-modal-body {
  flex: 1;
  overflow-y: auto;
  padding: 40px;
  background: #f4f6f5;
}
.preview-modal-footer {
  padding: 16px 24px;
  border-top: 1px solid var(--border);
  display: flex;
  justify-content: flex-end;
  gap: 12px;
}

/* Printable Invoice Template */
.invoice-print {
  background: #fff;
  padding: 50px;
  border: 1px solid var(--border);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.02);
  color: #000;
  font-family: Arial, sans-serif;
  font-size: 0.9rem;
  line-height: 1.5;
  text-align: left;
}
.invoice-print-header {
  display: flex;
  justify-content: space-between;
  margin-bottom: 40px;
}
.invoice-print-title {
  font-size: 1.8rem;
  font-weight: 800;
  color: #111;
  text-transform: uppercase;
  letter-spacing: -0.01em;
}
.invoice-address-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  margin-bottom: 45px;
}
.address-block {
  font-style: normal;
}
.address-label {
  font-size: 0.7rem;
  text-transform: uppercase;
  color: #777;
  font-weight: 700;
  margin-bottom: 6px;
  letter-spacing: 0.05em;
}
.invoice-meta-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  border-top: 2px solid #000;
  border-bottom: 2px solid #000;
  padding: 16px 0;
  margin-bottom: 40px;
}
.meta-item h4 {
  font-size: 0.7rem;
  text-transform: uppercase;
  color: #777;
  margin-bottom: 4px;
  letter-spacing: 0.03em;
}
.meta-item p {
  font-size: 0.95rem;
  font-weight: 700;
  margin: 0;
}
.print-lines-table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 40px;
}
.print-lines-table th {
  border-bottom: 2px solid #000;
  padding: 8px 4px;
  font-size: 0.7rem;
  text-transform: uppercase;
  color: #777;
  text-align: left;
  letter-spacing: 0.03em;
}
.print-lines-table td {
  border-bottom: 1px solid #eee;
  padding: 10px 4px;
  vertical-align: top;
}
.print-lines-table th.num, .print-lines-table td.num {
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.print-totals {
  margin-left: auto;
  width: 320px;
  margin-bottom: 45px;
}
.print-totals-row {
  display: flex;
  justify-content: space-between;
  padding: 6px 0;
}
.print-totals-row.grand {
  border-top: 2px solid #000;
  font-size: 1.1rem;
  font-weight: 800;
  padding-top: 10px;
}
.invoice-print-footer {
  border-top: 1px solid #eee;
  padding-top: 24px;
  font-size: 0.8rem;
  color: #666;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  line-height: 1.6;
}

/* Print Styles Override */
@media print {
  body * {
    visibility: hidden;
  }
  .preview-modal, .preview-modal-content, .preview-modal-body, .invoice-print, .invoice-print * {
    visibility: visible;
  }
  .preview-modal {
    position: absolute;
    left: 0; top: 0; width: 100%; height: auto;
    background: transparent;
    padding: 0;
    display: block;
  }
  .preview-modal-content {
    box-shadow: none;
    height: auto;
    border-radius: 0;
    width: 100%;
  }
  .preview-modal-header, .preview-modal-footer {
    display: none !important;
  }
  .preview-modal-body {
    padding: 0;
    background: #fff;
  }
  .invoice-print {
    border: none;
    box-shadow: none;
    padding: 0;
  }
}

/* ---------- Checkliste (Lead-Magnet) ---------- */
.check-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  flex-wrap: wrap;
  background: var(--bg-soft);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 16px 20px;
  margin: 22px 0 26px;
}

.check-progress {
  font-weight: 600;
  font-size: 0.95rem;
}

.check-progress-bar {
  width: 240px;
  max-width: 60vw;
  height: 8px;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 99px;
  margin-top: 6px;
  overflow: hidden;
}

.check-progress-fill {
  height: 100%;
  width: 0;
  background: linear-gradient(90deg, var(--accent), var(--neon));
  border-radius: 99px;
  transition: width 0.25s ease;
}

.check-toolbar-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.check-group {
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 18px 20px;
  margin: 18px 0;
  background: #fff;
}

.check-group h2 {
  font-size: 1.05rem;
  margin: 0 0 6px;
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.check-badge {
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--warn);
  background: var(--warn-bg);
  border-radius: 99px;
  padding: 3px 10px;
  white-space: nowrap;
}

.check-item {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 10px 4px;
  border-top: 1px solid var(--border);
  cursor: pointer;
}

.check-item:first-of-type { border-top: none; }

.check-item input[type="checkbox"] {
  accent-color: var(--accent);
  width: 19px;
  height: 19px;
  flex: 0 0 auto;
  margin-top: 3px;
  cursor: pointer;
}

.check-item:has(input:checked) span {
  opacity: 0.55;
}

@media print {
  .checkliste-page * { visibility: visible; }
  .checkliste-page .site-header,
  .checkliste-page .site-footer,
  .checkliste-page .no-print { display: none !important; }
  .checkliste-page .article { padding: 0; }
  .checkliste-page .check-group {
    break-inside: avoid;
    border: 1px solid #999;
    margin: 10px 0;
  }
  .checkliste-page a { color: inherit; text-decoration: none; }
  .checkliste-page h1 { font-size: 20pt; }
}


/* FakturKlar Werkbank — editorial production layer */
:root { --paper:#f4f1e9; --paper-deep:#e9e4d8; --red:#bc3f2f; --navy:#18272a; --rule:#c9c3b5; }
body { font-family: Arial, Helvetica, sans-serif; }
:focus-visible { outline: 3px solid var(--red); outline-offset: 3px; }
.wide-container { width:min(1180px, calc(100% - 48px)); margin-inline:auto; }
.workbench-page { background:var(--paper); color:var(--navy); }
.workbench-page .site-header { background:rgba(244,241,233,.94); border-color:var(--rule); backdrop-filter:none; }
.workbench-page .header-inner { height:72px; }
.workbench-page .logo { font-family:Georgia, serif; font-size:1.35rem; letter-spacing:-.02em; }
.workbench-page nav { display:flex; align-items:center; gap:28px; }
.workbench-page nav a { margin:0; color:var(--navy); font-size:.85rem; font-weight:700; }
.header-action { border:1px solid var(--navy); color:var(--navy); text-decoration:none; padding:10px 15px; font-size:.8rem; font-weight:700; }
.hero-workbench { padding:94px 0 82px; text-align:left; border-bottom:1px solid var(--rule); }
.hero-grid { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(330px,.7fr); gap:90px; align-items:end; }
.eyebrow,.section-index { font:700 .72rem/1 Arial,sans-serif; letter-spacing:.14em; text-transform:uppercase; color:var(--red); margin-bottom:22px; }
.workbench-page h1,.workbench-page h2 { font-family:Georgia,'Times New Roman',serif; font-weight:400; letter-spacing:-.045em; }
.hero-workbench h1 { font-size:clamp(3.7rem,7.5vw,7rem); line-height:.88; background:none; -webkit-text-fill-color:currentColor; max-width:760px; }
.hero-workbench h1 em { color:var(--red); font-weight:400; }
.hero-workbench .hero-sub { margin:30px 0 0; max-width:680px; font-size:1.25rem; line-height:1.55; color:#425154; }
.hero-actions { display:flex; align-items:center; gap:28px; margin-top:34px; }
.workbench-page .btn-primary { border-radius:0; background:var(--navy); padding:15px 24px; box-shadow:none; }
.workbench-page .btn-primary:hover { background:var(--red); box-shadow:none; transform:none; }
.text-action { color:var(--navy); text-decoration:none; font-weight:700; border-bottom:1px solid currentColor; padding-bottom:3px; }
.proof-line { display:flex; flex-wrap:wrap; gap:10px 30px; list-style:none; margin-top:40px; font-size:.75rem; text-transform:uppercase; letter-spacing:.06em; color:#596669; }
.proof-line li::before { content:'✓'; color:var(--red); margin-right:7px; }
.process-sheet { background:#fffdf8; border:1px solid var(--navy); padding:0 28px 25px; box-shadow:10px 10px 0 var(--paper-deep); transform:rotate(1deg); }
.sheet-head { display:flex; justify-content:space-between; padding:15px 0; border-bottom:2px solid var(--navy); font-size:.67rem; font-weight:700; letter-spacing:.1em; }
.local-status { color:#1d6d48; }
.process-sheet ol { list-style:none; }
.process-sheet li { display:grid; grid-template-columns:38px 1fr; gap:12px; padding:20px 0; border-bottom:1px solid var(--rule); }
.process-sheet li>span { font:italic 1.15rem Georgia,serif; color:var(--red); }
.process-sheet strong,.process-sheet small { display:block; }
.process-sheet small { color:#647073; margin-top:4px; line-height:1.4; }
.sheet-note { margin-top:20px; font-size:.8rem; line-height:1.55; }
.workbench-tool { padding:110px 0; background:#fffdf8; border-bottom:1px solid var(--rule); }
.tool-grid { display:grid; grid-template-columns:.7fr 1.3fr; gap:100px; align-items:start; }
.tool-intro h2,.section-heading-row h2,.deadline-grid h2,.principle-grid h2,.clean-faq h2 { font-size:clamp(2.5rem,4.5vw,4.4rem); line-height:1; }
.tool-intro>p:not(.section-index) { color:#596669; margin-top:25px; max-width:420px; }
.capability-list { margin-top:38px; border-top:2px solid var(--navy); }
.capability-list div { display:grid; grid-template-columns:95px 1fr; padding:13px 0; border-bottom:1px solid var(--rule); font-size:.85rem; }
.capability-list dt { font-weight:700; }.capability-list dd { color:#596669; }
.tool-surface .dropzone { border:1px solid var(--navy); border-radius:0; background:var(--paper); box-shadow:none; backdrop-filter:none; }
.tool-surface .dropzone:hover,.tool-surface .dropzone.dragover { background:#ece8dc; transform:none; box-shadow:inset 0 0 0 3px var(--red); border-color:var(--red); }
.tool-surface .dropzone-inner { padding:68px 20px; }
.file-mark { display:inline-grid; place-items:center; width:72px; height:88px; border:2px solid var(--navy); font-size:.7rem; font-weight:800; letter-spacing:.08em; margin-bottom:22px; position:relative; }
.file-mark::after { content:''; position:absolute; right:-2px; top:-2px; width:18px; height:18px; background:var(--paper); border-left:2px solid var(--navy); border-bottom:2px solid var(--navy); }
.privacy-stamp { display:inline-block; margin-top:18px; color:#1d6d48; border:1px solid #1d6d48; padding:5px 9px; font-size:.67rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; }
.workbench-page .btn-secondary { border-radius:0; border-color:var(--navy); box-shadow:none; background:transparent; }
.path-section { padding:100px 0; border-bottom:1px solid var(--rule); }
.section-heading-row { display:flex; justify-content:space-between; align-items:end; gap:40px; margin-bottom:45px; }
.section-heading-row p { width:330px; color:#596669; }
.path-list { border-top:2px solid var(--navy); }
.path-list a { display:grid; grid-template-columns:70px 1fr auto; align-items:center; gap:20px; color:var(--navy); text-decoration:none; padding:25px 10px; border-bottom:1px solid var(--rule); transition:padding .15s,background .15s; }
.path-list a:hover { padding-inline:20px; background:#fffdf8; }
.path-list strong,.path-list small { display:block; }.path-list strong { font:400 1.65rem Georgia,serif; }.path-list small { color:#657174; margin-top:4px; }
.path-number { color:var(--red); font:italic 1.1rem Georgia,serif; }
.deadline-section { padding:100px 0; background:var(--navy); color:var(--paper); }
.deadline-grid { display:grid; grid-template-columns:.8fr 1.2fr; gap:100px; }
.deadline-grid>div:first-child>p:not(.section-index) { color:#afbbba; margin:25px 0; max-width:390px; }
.deadline-grid .text-action { color:var(--paper); }
.deadline-list { border-top:1px solid #667173; }
.deadline-list>div { display:grid; grid-template-columns:130px 1fr; padding:24px 0; border-bottom:1px solid #667173; }
.deadline-list time { font:italic 2rem Georgia,serif; color:#aeb8b7; }.deadline-list .active time { color:#e9725e; }.deadline-list p { color:#c8d0cf; }
.principle-section { padding:110px 0; background:#fffdf8; }
.principle-grid { display:grid; grid-template-columns:1fr 1fr; gap:100px; }
.manifesto { font:400 clamp(1.25rem,2vw,1.7rem)/1.5 Georgia,serif; }
.manifesto p+p { margin-top:24px; }.manifesto .founder-line { font:700 .8rem/1.5 Arial,sans-serif; text-transform:uppercase; letter-spacing:.06em; }
.clean-faq { padding:100px 0; background:var(--paper); }
.clean-faq details { border:0; border-bottom:1px solid var(--rule); border-radius:0; background:transparent; box-shadow:none; margin:0; padding:22px 0; }
.clean-faq details:first-of-type { margin-top:40px; border-top:2px solid var(--navy); }
.clean-faq details:hover { box-shadow:none; border-color:var(--red); }
.workbench-page .site-footer { background:var(--navy); color:var(--paper); text-align:left; padding:65px 0 25px; border:0; }
.footer-grid { display:grid; grid-template-columns:2fr repeat(3,1fr); gap:50px; }.footer-grid>div { display:flex; flex-direction:column; align-items:flex-start; gap:8px; }.footer-grid .logo { color:var(--paper); }.footer-grid a { color:#bec8c6; text-decoration:none; font-size:.85rem; }.footer-grid strong { font-size:.75rem; letter-spacing:.08em; text-transform:uppercase; margin-bottom:8px; }.footer-grid p { color:#9fadaa; font-size:.85rem; }.footer-base { border-top:1px solid #536063; margin-top:50px; padding-top:20px; color:#95a3a1; font-size:.72rem; }
@media(max-width:850px){.hero-grid,.tool-grid,.deadline-grid,.principle-grid{grid-template-columns:1fr;gap:55px}.process-sheet{transform:none}.workbench-page nav a:nth-child(3),.workbench-page nav a:nth-child(4){display:none}.header-action{display:none}.section-heading-row{align-items:start;flex-direction:column}.section-heading-row p{width:auto}.footer-grid{grid-template-columns:1fr 1fr}.hero-workbench{padding-top:65px}}
@media(max-width:560px){.wide-container{width:min(100% - 30px,1180px)}.workbench-page .header-inner{height:60px}.workbench-page nav{gap:15px}.hero-workbench h1{font-size:3.5rem}.hero-actions{align-items:stretch;flex-direction:column}.workbench-page .btn-primary{width:100%;text-align:center}.proof-line{display:grid}.workbench-tool,.path-section,.deadline-section,.principle-section,.clean-faq{padding:72px 0}.path-list a{grid-template-columns:38px 1fr auto;gap:10px}.path-list strong{font-size:1.25rem}.deadline-list>div{grid-template-columns:90px 1fr}.footer-grid{grid-template-columns:1fr 1fr}.footer-grid>div:first-child{grid-column:1/-1}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}