.wrap { max-width: 980px; margin: 0 auto; padding: 0 20px; }

body.chk {
  margin: 0;
  background: var(--eggshell);
  color: var(--ink);
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: 1.55;
}

.chk .top {
  background: var(--white);
  border-bottom: 1px solid var(--line);
}
.chk .top .wrap {
  display: flex; align-items: center; gap: 16px;
  min-height: 56px;
}
.chk .brand { display: flex; align-items: baseline; gap: 10px; text-decoration: none; color: inherit; }
.chk .brand .mark { font-weight: 600; letter-spacing: -.01em; color: var(--aubergine); }
.chk .brand .sub { font-size: var(--fs-small); color: var(--grey); }
.chk .top .sp { flex: 1; }
.chk .top a.quiet { font-size: var(--fs-small); color: var(--grey); text-decoration: none; }
.chk .top a.quiet:hover { color: var(--aubergine); text-decoration: underline; }

.prog { margin: 28px 0 6px; }
.prog .lbl {
  font-size: var(--fs-label); letter-spacing: .09em; text-transform: uppercase;
  color: var(--grey); margin-bottom: 7px;
}
.prog .bars { display: flex; gap: 5px; }
.prog .bars i {
  flex: 1; height: 3px; border-radius: var(--r); background: var(--grey-16);
}
.prog .bars i.on { background: var(--process); }

.scr { padding: 8px 0 48px; }
.scr[hidden] { display: none; }

.scr h1:focus, .scr h2:focus { outline: none; }

.kicker {
  font-size: var(--fs-label); letter-spacing: .09em; text-transform: uppercase;
  color: var(--ember-dark); margin: 0 0 10px;
}
.scr h1 {
  font-family: var(--font-head); font-weight: 600; letter-spacing: -.015em;
  font-size: 30px; line-height: 1.2; margin: 0 0 14px; color: var(--aubergine);
}
.scr h2 {
  font-family: var(--font-head); font-weight: 600; font-size: 21px;
  line-height: 1.25; margin: 0 0 8px; color: var(--aubergine);
}
.lead { font-size: 17px; line-height: 1.5; margin: 0 0 22px; max-width: 62ch; }
.sub { color: var(--grey); margin: 0 0 20px; max-width: 62ch; }

.hint {
  background: var(--lavender-12); border: 1px solid var(--lavender-50);
  border-radius: var(--r-lg); padding: var(--pad-card);
  margin: 0 0 24px; font-size: var(--fs-small); max-width: 62ch;
}
.hint b { color: var(--aubergine); }

.hint a { color: var(--aubergine); font-weight: 600; }
.hint[data-mailaus] { margin-top: 24px; }

.fld { margin: 0 0 22px; max-width: 52ch; }
.fld label {
  display: block; font-weight: 600; font-size: var(--fs-small);
  margin: 0 0 6px; color: var(--aubergine);
}
.fld input[type=text], .fld input[type=email], .fld textarea {
  width: 100%; box-sizing: border-box;
  border: 1px solid var(--grey-40); border-radius: var(--r-sq);
  background: var(--white); color: var(--ink);
  font-family: inherit; font-size: var(--fs-body); line-height: 1.5;
  padding: 9px 11px; min-height: var(--touch);
}
.fld textarea { min-height: 76px; resize: vertical; }

.fld input::placeholder, .fld textarea::placeholder { color: var(--grey-56); opacity: 1; }

.fld input[readonly] { background: var(--eggshell); cursor: default; }
.fld input:focus, .fld textarea:focus {
  outline: 2px solid var(--lavender); outline-offset: 1px; border-color: var(--lavender);
}
.fld .note { font-size: var(--fs-small); color: var(--grey); margin: 6px 0 0; }

.err {
  display: none; margin: 7px 0 0; font-size: var(--fs-small);
  color: var(--ember-dark); font-weight: 600;
}
.err.on { display: block; }
.fld.bad input, .fld.bad textarea { border-color: var(--ember); }

.tiles {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(212px, 1fr));
  gap: 9px; margin: 0 0 22px;
}
.tile {
  display: block; text-align: left; cursor: pointer;
  background: var(--white); border: 1px solid var(--grey-16);
  border-radius: var(--r-md); padding: 11px 13px;
  font-family: inherit; font-size: var(--fs-body); color: var(--ink);
  min-height: var(--touch);
}
.tile:hover { border-color: var(--lavender); }
.tile[aria-pressed=true] {
  border-color: var(--aubergine); background: var(--aubergine-12);
  font-weight: 600; color: var(--aubergine);
}
.tile.more { border-style: dashed; border-color: var(--ember-50); color: var(--ember-dark); }
.tile:focus-visible { outline: 2px solid var(--lavender); outline-offset: 2px; }

.vent { display: none; margin: 0 0 22px; max-width: 52ch; }
.vent.on { display: block; }

.lade {
  display: flex; align-items: center; gap: 8px;
  font-size: var(--fs-small); font-weight: 600; color: var(--aubergine);
  margin: 0 0 12px;
}
.lade .spin {
  width: 12px; height: 12px; flex: none;
  border: 2px solid var(--lavender-50); border-top-color: var(--aubergine);
  border-radius: var(--r); animation: chkspin 850ms linear infinite;
}

.btn {
  display: inline-block; cursor: pointer;
  background: var(--aubergine); color: var(--white);
  border: 1px solid var(--aubergine); border-radius: var(--r);
  font-family: inherit; font-size: var(--fs-body); font-weight: 600;
  padding: 10px 22px; min-height: var(--touch);
}
.btn:hover { background: var(--aubergine-80); }
.btn[disabled] { opacity: .5; cursor: default; }
.btn.ghost { background: transparent; color: var(--aubergine); }
.btn.ghost:hover { background: var(--aubergine-12); }
.btn:focus-visible { outline: 2px solid var(--lavender); outline-offset: 2px; }
.after { margin-left: 12px; font-size: var(--fs-small); color: var(--grey); }

.cons { margin: 0 0 20px; max-width: 62ch; }
.cons label {
  display: flex; gap: 10px; align-items: flex-start;
  margin: 0 0 13px; font-size: var(--fs-small); line-height: 1.5;
}
.cons input[type=checkbox] { margin-top: 3px; width: 16px; height: 16px; flex: none; }
.cons .free { color: var(--grey); }
.cons a { color: var(--aubergine); }

.foot-note { font-size: var(--fs-small); color: var(--grey); margin: 18px 0 0; }

.ctx {
  background: var(--white); border: 1px solid var(--grey-16);
  border-radius: var(--r-lg); box-shadow: var(--e2-sh);
  padding: var(--pad-card); margin: 0 0 28px; max-width: 62ch;
}
.ctx[hidden] { display: none; }
.ctx .hd {
  display: flex; align-items: center; gap: 8px;
  font-weight: 600; font-size: var(--fs-small); color: var(--aubergine);
  margin: 0 0 12px;
}
.ctx .spin {
  width: 12px; height: 12px; flex: none;
  border: 2px solid var(--lavender-50); border-top-color: var(--aubergine);
  border-radius: var(--r); animation: chkspin 850ms linear infinite;
}
@keyframes chkspin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .ctx .spin, .lade .spin { animation: none; } }

.ctx .row { display: flex; gap: 12px; margin: 0 0 9px; font-size: var(--fs-small); }
.ctx .row .k {
  flex: none; width: 46px; color: var(--grey);
  font-size: var(--fs-label); letter-spacing: .08em; text-transform: uppercase;
  padding-top: 3px;
}
.ctx .row .v { flex: 1; }
.ctx .skel {
  display: block; height: 11px; border-radius: var(--r);
  background: var(--grey-16); max-width: 72%;
}
.ctx .fn { font-size: var(--fs-small); color: var(--grey); margin: 12px 0 0; }

.ctx.ask { border-color: var(--ember-50); background: var(--ember-12); }
.ctx.ask .hd { color: var(--ember-dark); }

.wait { padding: 40px 0 60px; max-width: 62ch; }
.bar { height: 5px; border-radius: var(--r); background: var(--grey-16); overflow: hidden; margin: 0 0 22px; }
.bar i { display: block; height: 100%; background: var(--process); width: 8%; transition: width .5s ease; }
.steps { list-style: none; padding: 0; margin: 0 0 22px; }
.steps li { display: flex; gap: 10px; margin: 0 0 9px; font-size: var(--fs-small); color: var(--grey); }
.steps li .m { flex: none; width: 14px; color: var(--grey-40); }
.steps li.done { color: var(--ink); }
.steps li.done .m { color: var(--aubergine); }

.rep { max-width: 74ch; padding: 8px 0 60px; }
.rep h2 {
  display: flex; align-items: baseline; gap: 10px;
  font-size: var(--fs-small); letter-spacing: .08em; text-transform: uppercase;
  color: var(--aubergine); margin: 34px 0 10px;
}
.rep h2 .sn {
  flex: none; width: 19px; height: 19px; border-radius: var(--r);
  background: var(--aubergine); color: var(--white);
  font-size: var(--fs-micro); letter-spacing: 0; text-align: center; line-height: 19px;
}
.rep h3 {
  font-size: var(--fs-small); letter-spacing: .06em; text-transform: uppercase;
  color: var(--ember-dark); margin: 22px 0 8px;
}
.rep p { margin: 0 0 12px; }
.rep ul, .rep ol { margin: 0 0 14px; padding-left: 22px; }
.rep li { margin: 0 0 6px; }
.rep table { border-collapse: collapse; width: 100%; margin: 0 0 16px; font-size: var(--fs-small); }
.rep th, .rep td { text-align: left; vertical-align: top; padding: 8px 10px; border-bottom: 1px solid var(--line); }
.rep th { color: var(--grey); font-size: var(--fs-label); letter-spacing: .07em; text-transform: uppercase; }
.rep .tw { overflow-x: auto; }

.rep .einordnung { font-size: var(--fs-small); color: var(--grey); margin: 24px 0 0; }

.cta { background: var(--aubergine); color: var(--white);
       border-radius: var(--r-lg); padding: 22px 24px; margin: 28px 0 0; }
.cta h2 { color: var(--white); }
.cta h2 .sn { background: var(--white); color: var(--aubergine); }
.cta p { color: var(--lavender-50); }
.cta .btn { background: var(--white); color: var(--aubergine); border-color: var(--white); }
.cta .btn.ghost { background: transparent; color: var(--white); border-color: var(--lavender-50); }

.cta a.btn { box-sizing: border-box; text-decoration: none; line-height: normal; }
.cta .small { font-size: var(--fs-small); color: var(--lavender-50); margin: 14px 0 0; }

.bye { font-size: var(--fs-small); color: var(--grey); margin: 30px 0 0; }

.chk .bot { border-top: 1px solid var(--line); background: var(--white); }
.chk .bot .wrap { display: flex; gap: 16px; flex-wrap: wrap; padding-top: 16px; padding-bottom: 22px; }
.chk .bot a { font-size: var(--fs-small); color: var(--grey); text-decoration: none; }
.chk .bot a:hover { color: var(--aubergine); text-decoration: underline; }

@media (max-width: 640px) {
  .scr h1 { font-size: 25px; }
  .tiles { grid-template-columns: 1fr; }
}

@media print {
  @page { margin: 16mm 15mm; }
  body.chk { background: #fff; }
  .chk .top { border-bottom: 0; }
  .chk .top a.quiet, .chk .bot, .cta .btn, .cta .small, .cta .err, .bye,
  .hint[data-mailaus],
  #usercentrics-root, #usercentrics-cmp-ui { display: none !important; }
  .rep { max-width: none; padding: 0; }
  .rep h2, .rep h3 { break-after: avoid; }
  .rep tr, .rep li { break-inside: avoid; }
  .rep .tw { overflow: visible; }
  .rep h2 .sn { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .cta { background: none; color: var(--ink); border: 1px solid var(--line); break-inside: avoid; }
  .cta h2 { color: var(--aubergine); }
  .cta h2 .sn { background: var(--aubergine); color: var(--white); }
  .cta p { color: var(--ink); }
}