.btn {
  font-family: var(--font-sans); font-weight: 800; font-size: 19px; letter-spacing: -.01em;
  background: var(--effekt-aktuell, var(--violet)); color: var(--auf-farbe); border: 0; padding: 14px 26px; cursor: pointer;
  display: inline-flex; align-items: center; gap: 10px; border-radius: var(--radius);
  text-decoration: none;
}
.btn:hover:not(:disabled) { background: color-mix(in srgb, var(--effekt-aktuell, var(--violet)) 60%, var(--hover-tiefe)); color: var(--hover-schrift); }
.btn:disabled { opacity: .4; cursor: not-allowed; }
.btn-ghost { background: transparent; color: var(--ink); border: 2px solid var(--effekt-aktuell, var(--ink)); }
.btn-ghost:hover:not(:disabled) { background: color-mix(in srgb, var(--effekt-aktuell, var(--violet)) 60%, var(--hover-tiefe)); border-color: var(--effekt-aktuell, var(--violet)); color: var(--hover-schrift); }

.chip {
  font-family: var(--font-mono); font-size: 13.5px; font-weight: 700;
  border: 1.5px solid var(--ink-45); background: transparent; color: var(--ink);
  padding: 10px 14px; cursor: pointer; border-radius: 0; transition: .14s;
}

.chip:not(.aus):hover { border-color: var(--effekt-aktuell, var(--violet)); background: color-mix(in srgb, var(--effekt-aktuell, var(--violet)) 60%, var(--hover-tiefe)); color: var(--hover-schrift); }

.chip.aus {
  display: inline-block; border-style: dashed; border-color: var(--rand);
  color: var(--ink-45); cursor: default; font-weight: 500;
}
.chip.aus:hover { border-color: var(--rand); background: transparent; color: var(--ink-45); }

.prow .btn:not(.btn-ghost), .paket-cta .btn:not(.btn-ghost), .kapa .btn:not(.btn-ghost) { background: var(--effekt-aktuell, var(--violet)); }
.prow .btn:not(.btn-ghost):hover:not(:disabled), .paket-cta .btn:not(.btn-ghost):hover:not(:disabled), .kapa .btn:not(.btn-ghost):hover:not(:disabled) { background: color-mix(in srgb, var(--effekt-aktuell, var(--violet)) 60%, var(--hover-tiefe)); color: var(--hover-schrift); }
.korb-form .chip { border: 1.5px solid var(--effekt-aktuell, var(--violet)); color: var(--ink); font-weight: 700; }
.korb-form .chip:hover { background: color-mix(in srgb, var(--effekt-aktuell, var(--violet)) 60%, var(--hover-tiefe)); border-color: var(--effekt-aktuell, var(--violet)); color: var(--hover-schrift); }

.instrument {
  --effekt: var(--effekt-aktuell, var(--violet));
  margin: 44px 0 0;
  border: 1.5px solid var(--ink);
  background: var(--paper-2);
  box-shadow: 6px 6px 0 var(--effekt);
}
.instrument .chip:not(.aus):hover, #kalkulator + .chips .chip:not(.aus):hover { border-color: var(--effekt-aktuell, var(--violet)); background: color-mix(in srgb, var(--effekt-aktuell, var(--violet)) 60%, var(--hover-tiefe)); color: var(--hover-schrift); }
.instrument .chip.aktiv, #kalkulator + .chips .chip.aktiv { border-color: var(--effekt-aktuell, var(--violet)); border-width: 2px; color: var(--auf-farbe); background: var(--effekt-aktuell, var(--violet)); }

.instrument .chip.chip-farbig, #kalkulator + .chips .chip.chip-farbig { border-color: var(--effekt-aktuell, var(--ink-45)); }
.instrument.kompakt { margin-top: 24px; }
.inst-head {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  padding: 12px 18px; border-bottom: 1px solid var(--rule);
  font-size: 13.5px; letter-spacing: .08em; text-transform: uppercase;
  font-weight: 700; color: var(--ink);
}
.inst-head #modelTag { font-weight: 400; color: var(--ink-70); }
.inst-body { padding: 24px 18px 20px; }
.inst-body label { position: absolute; left: -9999px; }
.instrument textarea {
  width: 100%; border: 0; background: transparent; resize: vertical;
  font-family: var(--font-sans); font-size: clamp(17px, 2vw, 21px); line-height: 1.42;
  color: var(--ink); min-height: 112px; letter-spacing: -.01em; padding: 0;
}
.instrument textarea::placeholder { color: var(--ink-45); }
.instrument textarea { scrollbar-width: none; }
.instrument textarea::-webkit-scrollbar { display: none; }
.instrument textarea:focus-visible { outline-offset: 6px; }
.chips { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 16px; }
#kalkulator + .chips { margin: 26px 0 6px; }
#kalkulator:not(.kompakt) + .chips { margin-top: 75px; }
.inst-foot {
  display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap;
  border-top: 1px solid var(--rule); padding: 14px 18px;
}
.count { font-size: 13.5px; font-weight: 600; color: var(--ink-70); }
.field-error { color: var(--warn-text); font-size: 13px; margin: 8px 0 0; }

.readout { display: none; border-top: 1.5px solid var(--ink); }
.readout.on { display: block; }
.log { padding: 18px; background: var(--grund-0); color: var(--ink); font-family: var(--font-mono); font-size: 12.5px; line-height: 2; min-height: 54px; }
.log div { white-space: pre-wrap; }
.log b { color: var(--violet); font-weight: 500; }
.log .ok { color: var(--ok); }
.log .warn { color: var(--warn); }
.log .cursor { display: inline-block; width: .6em; height: 1.1em; background: var(--ink-45); vertical-align: -0.2em; margin-left: 2px; animation: blink 1s steps(1) infinite; }
@keyframes blink { 50% { opacity: 0; } }

.result { padding: 0; }
.archiv { padding: 12px 26px; background: var(--grund-0); color: var(--warn-text); font-size: 13px; border-bottom: 1px solid var(--rule); font-family: var(--font-mono); }
.archiv b { color: var(--warn-text); font-weight: 700; }
.bewertung { margin-top: 10px !important; font-size: 13px !important; color: var(--ink-45) !important; }
.bewertung .mono { color: var(--violet); }
.price-block {
  background: var(--violet); color: var(--auf-farbe); padding: 30px 26px;
  display: flex; flex-wrap: wrap; gap: 26px; align-items: flex-end; justify-content: space-between;
  clip-path: inset(0 0 0 0);
}
.price-block.wipe { animation: wipe .9s var(--ease-out) forwards; }
@keyframes wipe { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0 0 0 0); } }
.price-block.rueckfrage { background: var(--tuerkis); color: var(--tuerkis-auf); }
.price-lab { font-size: 14px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; opacity: 1; margin-bottom: 8px; }
.price { font-family: var(--font-mono); font-weight: 700; font-size: clamp(30px, 5vw, 52px); letter-spacing: -.03em; line-height: 1; font-variant-numeric: tabular-nums; }
.price-text { font-family: var(--font-sans); font-weight: 800; font-size: clamp(22px, 3.2vw, 34px); letter-spacing: -.03em; }
.price small { font-size: .45em; opacity: .7; font-weight: 400; letter-spacing: 0; }
.price-meta { text-align: right; font-size: 13px; line-height: 1.7; opacity: .9; }
.price-meta b { display: block; font-size: 19px; font-weight: 800; letter-spacing: -.02em; opacity: 1; }
@media (max-width: 599px) { .price-meta { text-align: left; } }
.preis-fussnote { margin: 0; padding: 12px 26px; font-size: 13px; line-height: 1.5; color: var(--ink-45); border-bottom: 1px solid var(--rule); }

.grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0; }
@media (max-width: 1023px) { .grid { grid-template-columns: 1fr; } }
.cell { padding: 22px 26px; border-top: 1px solid var(--rule); border-right: 1px solid var(--rule); min-width: 0; overflow-wrap: break-word; }
.cell li span:first-child { min-width: 0; }
.cell:nth-child(even), .cell.full { border-right: 0; }
.grid > .cell.full { grid-column: 1 / -1; }
@media (max-width: 1023px) { .cell { border-right: 0; } }
.cell :is(h3, h4) { font-size: 14px; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-70); margin: 0 0 12px; font-weight: 800; }
.cell ul { margin: 0; padding: 0; list-style: none; font-size: 14.5px; line-height: 1.6; }
.cell li { padding: 5px 0; border-bottom: 1px solid var(--rule-soft); display: flex; justify-content: space-between; gap: 14px; }
.cell li:last-child { border-bottom: 0; }
.cell li span:last-child { font-family: var(--font-mono); font-size: 13px; color: var(--ink-45); white-space: nowrap; }
.cell li span:only-child { color: var(--ink); font-family: var(--font-sans); font-size: 14.5px; white-space: normal; }
.cell p { margin: 0; font-size: 14.5px; line-height: 1.6; color: var(--ink-70); }

.fahrplan, .heft, .technik { overflow-wrap: break-word; }

.ps-tabelle tr.ps-rundung th,
.ps-tabelle tr.ps-rundung td { color: var(--ink-45); }

.fahrplan { border-top: 1px solid var(--rule); padding: 22px 26px; }
.fahrplan :is(h3, h4) { font-size: 14px; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-70); margin: 0 0 12px; font-weight: 800; }
.fahrplan ol { margin: 0; padding: 0; list-style: none; font-size: 14.5px; line-height: 1.6; }
.fahrplan li { display: grid; grid-template-columns: 7.5em minmax(0, 1fr) auto; gap: 14px; align-items: baseline; padding: 5px 0; border-bottom: 1px solid var(--rule-soft); }
.fahrplan li:last-child { border-bottom: 0; }
.fp-woche { font-size: 13px; font-weight: 700; white-space: nowrap; color: var(--effekt-text, var(--violet)); }
.fp-was { color: var(--ink); }
.fp-detail { font-size: 13px; color: var(--ink-45); text-align: right; min-width: 0; }
.zeitstrahl { margin: 0 0 16px; padding-bottom: 4px; overflow-x: auto; scrollbar-width: thin; }
.zs-zeile { display: flex; align-items: stretch; min-width: min-content; }
.zs-name { flex: 0 0 12em; align-self: center; padding-right: 12px; font-size: 13px; line-height: 1.3; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.zs-wochen { flex: 1 1 auto; display: flex; }
.zs-zelle { flex: 1 0 36px; position: relative; display: flex; align-items: center; justify-content: center; height: 28px; font-size: 11.5px; color: var(--ink-45); border-left: 1px solid var(--rule-soft); }
.zs-kopfzeile .zs-zelle { height: 20px; font-weight: 700; }
.zs-bau .zs-zelle.an::before { content: ""; position: absolute; left: 0; right: 0; top: 9px; bottom: 9px; background: var(--effekt-aktuell, var(--violet)); }
.zs-bau .zs-zelle.von::before { left: 5px; }
.zs-bau .zs-zelle.bis::before { right: 5px; }
.zs-kickoff .zs-zelle.an::before, .zs-abnahme .zs-zelle.an::before { content: ""; width: 11px; height: 11px; transform: rotate(45deg); background: var(--ink); }
.zs-kopf { position: absolute; left: 4px; top: 50%; z-index: 1; transform: translateY(-50%); padding: 0 5px; font-size: 11px; font-weight: 800; line-height: 16px; white-space: nowrap; color: var(--auf-farbe); background: var(--ink); border-radius: var(--radius); }
.verstaerkung { margin: 16px 0 0; padding: 14px 0 0; border-top: 1px solid var(--rule-soft); }
.verstaerkung ul { margin: 0; padding: 0; list-style: none; font-size: 14.5px; line-height: 1.55; }
.fahrplan .verstaerkung li { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; padding: 4px 0; border-bottom: 0; color: var(--ink); }
.verstaerkung li.beste { font-weight: 700; }
.vs-beste { display: inline-block; margin-left: 8px; padding: 0 6px; font-size: 11.5px; font-weight: 800; line-height: 18px; white-space: nowrap; color: var(--auf-farbe); background: var(--effekt-aktuell, var(--violet)); border-radius: var(--radius); }
.vs-hinweis { margin: 8px 0 0; max-width: 80ch; font-size: 13px; line-height: 1.5; color: var(--ink-70); }
.zs-regler { flex: 0 0 7.5em; display: flex; align-items: center; justify-content: flex-end; gap: 4px; padding-left: 10px; }
.zs-knopf { width: 26px; height: 24px; padding: 0; font: inherit; font-size: 15px; font-weight: 800; line-height: 1; color: var(--ink); cursor: pointer;
  background: var(--paper-2); border: 1px solid var(--rand); border-radius: var(--radius); }
.zs-knopf:hover:not(:disabled) { border-color: var(--effekt-aktuell, var(--violet)); background: color-mix(in srgb, var(--effekt-aktuell, var(--violet)) 60%, var(--hover-tiefe)); color: var(--hover-schrift); }
.zs-knopf:disabled { opacity: .35; cursor: default; }
.zs-zahl { min-width: 1.4em; font-size: 13px; font-weight: 800; text-align: center; font-variant-numeric: tabular-nums; }
.zs-grund { font-size: 11px; color: var(--ink-45); white-space: nowrap; }
.zs-zeile.verstaerkt .zs-name { font-weight: 700; }
.zs-zeile.verstaerkt .zs-zahl { color: var(--effekt-text, var(--ink)); }
.zs-zelle.gespart { background-image: repeating-linear-gradient(135deg, transparent 0 5px, var(--rule-soft) 5px 6px); }
.zs-kopfzeile .zs-zelle.gespart { text-decoration: line-through; }
.fahrplan[aria-busy="true"] .zeitstrahl { opacity: .6; transition: opacity .15s linear; }
.vs-stand { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 0 0 10px; padding: 10px 12px; font-size: 14.5px; font-weight: 800; color: var(--ink);
  border: 1.5px solid var(--effekt-aktuell, var(--violet)); border-radius: var(--radius); }
.verstaerkung li.gewaehlt > span:first-child { text-decoration: underline; text-decoration-color: var(--effekt-aktuell, var(--violet)); text-underline-offset: 4px; }
.vs-waehlen { margin-left: 4px; }
.vs-korb { margin-left: auto; }
.plan-korb { margin: 0 0 18px; }
.vs-form { display: inline-flex; margin: 0; }
.vs-form.vs-korb { margin-left: auto; }
.nachbuchung .vs-stand > span { flex: 1 1 22em; }
.nachbuchung .vs-stand > a.btn { text-align: center; }
.korb-nachbuchungen { display: grid; gap: 12px; margin: 0 0 18px; }
.korb-nachbuchung .lead { margin: 6px 0; }
.korb-nachbuchung .next-actions { margin-top: 10px; }
.korb-verstaerkung { margin: 24px 0 8px; }
.korb-verstaerkung .fahrplan { margin-top: 8px; }
.meilenstein .ms-buchen { grid-column: 2 / -1; margin: 2px 0 0; }
.mission-cta { display: inline-flex; margin-top: 4px; }
.konto-buchen { display: inline-flex; margin-top: 6px; }
.vs-cta { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 6px 18px; margin: 4px 0 16px; padding: 14px 16px;
  border: 1.5px solid var(--ink); background: var(--paper-2); box-shadow: 5px 5px 0 var(--effekt-aktuell, var(--violet)); }
.vs-cta-titel { grid-column: 1; margin: 0; font-size: 20px; font-weight: 900; letter-spacing: -.02em; line-height: 1.2; color: var(--ink); }
.vs-cta-wochen { display: block; margin-top: 3px; font-size: 12.5px; font-weight: 700; letter-spacing: .02em; color: var(--ink-70); }
.vs-cta-was { grid-column: 1; margin: 0; font-size: 14px; line-height: 1.45; color: var(--ink-70); }
.vs-cta-form { grid-column: 2; grid-row: 1 / span 2; display: flex; margin: 0; }
.vs-cta-knopf { white-space: nowrap; }
.vs-cta-hinweis { grid-column: 1 / -1; margin: 4px 0 0; font-size: 12.5px; line-height: 1.5; color: var(--ink-70); }
.ct-verstaerkung { border-style: dashed; }
.crew-korb .crew-karten { margin-top: 8px; }
.crew-korb .fahrplan { margin-top: 8px; }
.crew-punkte li > a.btn { margin-left: auto; }
@media (max-width: 599px) {
  .vs-cta { grid-template-columns: 1fr; }
  .vs-cta-form { grid-column: 1; grid-row: auto; }
  .vs-cta-knopf { width: 100%; white-space: normal; }
  .crew-punkte li > a.btn { margin-left: 0; }
}
@media print { .vs-cta { display: none; } }
.crew-leiste { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 12px 0 0; font-size: 13.5px; font-weight: 700; color: var(--ink-70); }
.crew-leiste b { color: var(--ink); }
.crew-block { margin-top: 30px; }
.crew-kopfzeile { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 18px; margin: 0 0 14px; }
.crew-kopfzeile .mission-ampel { margin: 0; }
.crew-woche { font-size: 13px; font-weight: 700; color: var(--ink-70); }
.crew-marke { font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; padding: 3px 8px; border: 1.5px solid var(--ink); }
.crew-karten { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 16px; margin: 0 0 18px; }
.crew-trumpf { position: relative; border: 1.5px solid var(--ink); background: var(--paper-2); box-shadow: 5px 5px 0 var(--effekt, var(--effekt-aktuell, var(--violet))); padding: 12px 14px 14px; display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.ct-kopf { display: flex; justify-content: space-between; align-items: center; gap: 8px; font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-45); border-bottom: 1px solid var(--rule); padding-bottom: 6px; }
.ct-verf { color: var(--ink-70); white-space: nowrap; }
.ct-name { font-weight: 900; letter-spacing: -.02em; font-size: 18px; line-height: 1.2; margin: 4px 0 0; }
.ct-rolle { font-size: 12px; color: var(--violet-text, var(--violet)); margin: 0; }
.ct-einsatz { font-size: 12px; color: var(--ink-70); margin: 0; }
.ct-pillen { margin: 6px 0 0; }
.zs-namen { display: block; font-size: 11px; font-weight: 600; color: var(--ink-70); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.crew-sprint { margin: 0 0 14px; }
.crew-sprint ul { list-style: none; margin: 6px 0 0; padding: 0; display: grid; gap: 4px; font-size: 14px; }
.ct-warum { font-size: 13px; color: var(--ink-70); margin: 2px 0 0; }
.ct-trumpf { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 10px; margin: 6px 0 0; font-size: 12px; }
.ct-trumpf div { display: flex; justify-content: space-between; gap: 6px; }
.ct-trumpf dt { color: var(--ink-70); }
.ct-trumpf dd { margin: 0; font-weight: 800; }
.ct-traeger { font-size: 12.5px; color: var(--ink-70); margin: auto 0 0; padding-top: 8px; border-top: 1px solid var(--rule); }
.ct-traeger .mono { display: block; font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-45); margin-bottom: 2px; }
.crew-zeitstrahl { margin: 10px 0 6px; }
.crew-satz { font-size: 14px; color: var(--ink-70); margin: 8px 0 0; }
.crew-punkte { margin-top: 14px; }
.crew-punkte ul { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 0; }
.crew-punkte li { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; padding: 9px 0; border-top: 1px solid var(--rule); font-size: 14.5px; }
.crew-punkte li.beste > span:first-child { font-weight: 800; }
.crew-punkte li .vs-form, .crew-punkte li > a.chip { margin-left: auto; }
.crew-gruende li { font-size: 13.5px; color: var(--ink-70); }
.crew-weg { margin: 12px 0 0; }
.crew-drucken { background: none; border: 0; padding: 0; margin: 0; font: inherit; color: inherit; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
@media (max-width: 599px) { .crew-karten { grid-template-columns: 1fr; } .crew-punkte li .vs-form, .crew-punkte li > a.chip { margin-left: 0; } }
.zs-marke { margin-right: 2px; padding: 0 4px; font-size: 10.5px; font-weight: 800; line-height: 16px; color: var(--ink-70); border: 1px solid var(--rand); border-radius: var(--radius); }
.zs-regler.zs-tester { flex-basis: 9.5em; }
@media (max-width: 599px) {
  .zs-buchbar .zs-zeile { flex-wrap: wrap; row-gap: 2px; min-width: 0; }
  .zs-buchbar .zs-name { flex: 1 1 0; min-width: 0; }
  .zs-buchbar .zs-regler { flex: 0 0 auto; padding-left: 8px; }
  .zs-buchbar .zs-wochen { flex: 1 0 100%; order: 3; }
  .zs-buchbar .zs-kopfzeile .zs-name, .zs-buchbar .zs-kopfzeile .zs-regler { display: none; }
  .zs-buchbar .zs-zeile + .zs-zeile { border-top: 1px solid var(--rule-soft); padding-top: 4px; }
}
@media (prefers-reduced-motion: reduce) { .fahrplan[aria-busy="true"] .zeitstrahl { transition: none; } }
@media print { .zs-regler, .vs-waehlen { display: none !important; } }
@media (max-width: 599px) { .zs-name { flex-basis: 7.5em; } .zs-zelle { flex-basis: 32px; } }
.mission-zeitstrahl { margin: 18px 0 10px; }
.zs-zeile.stand-offen .zs-zelle.an::before { opacity: .45; }
.zs-zeile.stand-fertig .zs-name::after { content: " ✓"; color: var(--effekt-text, var(--ink)); }
.zs-zelle.heute { background: color-mix(in srgb, var(--effekt-aktuell, var(--violet)) 14%, transparent); }
.zs-kopfzeile .zs-zelle.heute { color: var(--effekt-text, var(--ink)); }
.zs-crew { margin: 10px 0 0; font-size: 14px; line-height: 1.5; color: var(--ink); }
.zs-crew-lab { margin-right: 6px; font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-70); }
@media (max-width: 599px) {
  .fahrplan { padding: 18px 20px; }
  .fahrplan li { grid-template-columns: 6.5em minmax(0, 1fr); }
  .fp-detail { grid-column: 2; text-align: left; }
}

.heft { border-top: 1px solid var(--rule); padding: 22px 26px; }
.heft :is(h3, h4), .technik :is(h3, h4) { font-size: 14px; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-70); margin: 0 0 12px; font-weight: 800; }
.heft-satz { margin: 0 0 8px; font-size: 14.5px; line-height: 1.6; color: var(--ink-70); }
.heft-satz b { color: var(--ink); margin-right: .5em; }
.heft-paare { margin: 16px 0 0; padding: 0; list-style: none; }
.heft-paare li { display: grid; grid-template-columns: 2em minmax(0, 1fr) minmax(0, 1fr); gap: 8px 18px; padding: 12px 0; border-top: 1px solid var(--rule-soft); align-items: start; }
.hp-nr { font-size: 13px; font-weight: 700; color: var(--effekt-text, var(--violet)); line-height: 1.7; }
.hp-soll, .hp-ist { font-size: 14.5px; line-height: 1.6; min-width: 0; }
.hp-soll { color: var(--ink); }
.hp-ist { color: var(--ink-70); }
.hp-lab { display: block; font-family: var(--font-mono); font-size: 10.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-45); font-weight: 700; margin-bottom: 3px; }
.heft-listen { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 18px; margin-top: 20px; padding-top: 18px; border-top: 1px solid var(--rule-soft); }
.heft-liste :is(h4, h5) { margin: 0 0 8px; font-size: 12px; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-45); font-weight: 800; }
.heft-liste ul { margin: 0; padding: 0 0 0 1.1em; font-size: 14px; line-height: 1.6; color: var(--ink-70); }
.heft-liste li { margin-bottom: 5px; }

.technik { border-top: 1px solid var(--rule); padding: 22px 26px; }
.technik ul { margin: 0; padding: 0; list-style: none; }
.technik li { display: grid; grid-template-columns: minmax(0, 14em) minmax(0, 1fr); gap: 6px 18px; padding: 7px 0; border-bottom: 1px solid var(--rule-soft); font-size: 14.5px; line-height: 1.6; }
.technik li:last-child { border-bottom: 0; }
.technik .pk-technik { margin: 0 0 14px; }
.technik .pk-technik .pk-tech { display: block; padding: 4px 10px 3px; border-bottom: 0; font-size: 13px; line-height: 17px; }
.tk-name { color: var(--ink); font-weight: 700; }
.tk-zweck { color: var(--ink-70); }

@media (max-width: 1023px) {
  .heft-paare li { grid-template-columns: 2em minmax(0, 1fr); }
  .hp-ist { grid-column: 2; }
}
@media (max-width: 599px) {
  .heft, .technik { padding: 18px 20px; }
  .technik li { grid-template-columns: minmax(0, 1fr); }
}

.disclaim { padding: 16px 26px; border-top: 1px solid var(--rule); background: var(--violet-tint); font-size: 14px; line-height: 1.6; color: var(--ink-70); }
.disclaim b { color: var(--ink); }
.next { padding: 22px 26px; border-top: 1px solid var(--rule); display: flex; gap: 14px; flex-wrap: wrap; align-items: center; justify-content: space-between; }
.next p { margin: 0; font-size: 14.5px; max-width: 46ch; color: var(--ink-70); }
.next-actions { display: flex; gap: 10px; flex-wrap: wrap; }

.ampel { font-size: 12px; line-height: 1; }
.ampel.frei { color: var(--ok); }
.ampel.bedingt { color: var(--warn); }
.ampel.beschaeftigt { color: var(--warn); }

.ampel.gruen { color: var(--ok); }
.ampel.gelb  { color: var(--warn); }
.ampel.rot   { color: var(--rot); }
.ampel-legende { font-size: 14px; font-weight: 600; color: var(--ink-70); margin: 0 0 8px; }

.mission-ampel { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 10px; margin: 12px 0 0;
  padding: 10px 14px; background: var(--paper-2); border-left: 3px solid var(--ink-45); border-radius: 2px; font-size: 14.5px; }
.mission-ampel.ampel-gruen { border-left-color: var(--ok); }
.mission-ampel.ampel-gelb  { border-left-color: var(--warn); }
.mission-ampel.ampel-rot   { border-left-color: var(--rot); }
.mission-ampel b { font-weight: 800; }
.mission-ampel-satz { color: var(--ink-70); min-width: 0; overflow-wrap: break-word; }

.mission-titel-klein { font-size: 13px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase;
  color: var(--ink-45); margin: 18px 0 8px; }
.terminliste { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.termin { display: grid; gap: 2px 12px; padding: 8px 0; border-top: 1px solid var(--rule-soft);
  grid-template-columns: auto 1fr; align-items: baseline; font-size: 14px; }
.termin .t-datum { color: var(--ink-45); }
.termin .t-art { font-weight: 700; }
.termin .t-notiz { grid-column: 1 / -1; color: var(--ink-70); overflow-wrap: break-word; }
.termin .t-weg { grid-column: 1 / -1; color: var(--ink-45); font-size: 12.5px; }
.termin .t-betrag { grid-column: 1 / -1; font-variant-numeric: tabular-nums; }
@media (min-width: 1024px) {
  .termin { grid-template-columns: 5.8rem 8.5rem 1fr auto auto; }
  .termin .t-notiz, .termin .t-weg, .termin .t-betrag { grid-column: auto; }
  .termin .t-betrag { text-align: right; min-width: 5rem; }
}

.mission-bonus { display: grid; gap: 2px; margin: 14px 0 0; padding: 10px 14px;
  background: var(--paper-2); border-left: 3px solid var(--ink-45); border-radius: 2px; font-size: 14.5px; }
.mission-bonus.steht { border-left-color: var(--ok); }
.mission-bonus b { font-weight: 800; }
.mission-bonus span { color: var(--ink-70); overflow-wrap: break-word; }

.mission-abnahme { display: grid; gap: 4px; margin: 14px 0 0; padding: 10px 14px;
  background: var(--paper-2); border-left: 3px solid var(--warn); border-radius: 2px; font-size: 14.5px; }
.mission-abnahme.fertig { border-left-color: var(--ok); }
.mission-abnahme b { font-weight: 800; }
.mission-abnahme span { color: var(--ink-70); overflow-wrap: break-word; }
.mission-abnahme-form { margin: 6px 0 2px; }
.mission-abnahme-hinweis { font-size: 13.5px; }

.mission-takeout { display: grid; gap: 4px; margin: 14px 0 0; padding: 10px 14px;
  background: var(--paper-2); border-left: 3px solid var(--effekt-aktuell, var(--violet)); border-radius: 2px; font-size: 14.5px; }
.mission-takeout.laeuft { border-left-color: var(--ok); }
.mission-takeout b { font-weight: 800; }
.mission-takeout span { color: var(--ink-70); overflow-wrap: break-word; }
.mission-takeout-form { margin: 6px 0 2px; }
.mission-takeout-hinweis { font-size: 13.5px; }

.forum { margin: 18px 0 0; padding-top: 14px; border-top: 1px solid var(--rule); }
.forum h2 { margin: 0 0 4px; font-size: 20px; letter-spacing: -.01em; }
.forum-hinweis { margin: 0 0 12px; color: var(--ink-70); font-size: 14px; overflow-wrap: break-word; }
.forumliste { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.forumliste li { padding-top: 8px; border-top: 1px solid var(--rule-soft); }
.forumliste li:first-child { border-top: 0; padding-top: 0; }
.forum-thema { display: flex; flex-wrap: wrap; gap: 2px 12px; align-items: baseline; font-weight: 700; }
.forum-thema a { overflow-wrap: anywhere; }
.forum-zeile { display: flex; flex-wrap: wrap; gap: 2px 12px; color: var(--ink-45); font-size: 13.5px; }
.forum-zu { font-family: var(--font-mono); font-size: 12px; font-weight: 600; letter-spacing: .06em;
  border: 1.5px solid var(--ink-45); padding: 1px 6px; color: var(--ink-70); }
.forum-leer { color: var(--ink-70); font-size: 14.5px; margin: 0 0 12px; }
.forum-form { display: grid; gap: 8px; margin: 16px 0 0; padding: 12px 14px;
  background: var(--paper-2); border-left: 3px solid var(--ink-45); border-radius: 2px; }
.forum-form label { font-size: 13.5px; font-weight: 700; }
.forum-form input, .forum-form textarea { width: 100%; font: inherit; font-size: 15px; color: var(--ink);
  background: var(--paper); border: 1px solid var(--rule); border-radius: 2px; padding: 8px 10px; }
.forum-form textarea { min-height: 7.5rem; resize: vertical; }
.forum-form button { justify-self: start; }
.beitraege { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.beitrag { padding: 10px 14px; background: var(--paper-2); border-left: 3px solid var(--ink-45); border-radius: 2px; }
.beitrag.von-uns { border-left-color: var(--effekt-aktuell, var(--violet)); }
.beitrag-kopf { display: flex; flex-wrap: wrap; gap: 2px 12px; align-items: baseline; font-size: 13.5px; }
.beitrag-wer { font-weight: 800; }
.beitrag-zeit { color: var(--ink-45); font-variant-numeric: tabular-nums; }
.beitrag-text { margin: 6px 0 0; white-space: pre-wrap; overflow-wrap: break-word; }
.anhaenge { list-style: none; margin: 8px 0 0; padding: 8px 0 0; border-top: 1px solid var(--rule-soft);
  display: grid; gap: 4px; font-size: 13.5px; }
.anhaenge li { display: flex; flex-wrap: wrap; gap: 2px 10px; align-items: baseline; }
.anhaenge a { overflow-wrap: anywhere; }
.anhang-groesse { color: var(--ink-45); font-variant-numeric: tabular-nums; }
.forum-anhangshinweis { color: var(--ink-45); font-size: 13px; margin-top: -2px; }
.forum-abweisung { margin: 0 0 12px; padding: 10px 14px; background: var(--paper-2);
  border-left: 3px solid var(--warn); border-radius: 2px; font-size: 14.5px; overflow-wrap: break-word; }
.forum-gespeichert { margin: 0 0 12px; padding: 10px 14px; background: var(--paper-2);
  border-left: 3px solid var(--ok); border-radius: 2px; font-size: 14.5px; }
.forum-meldeweise { display: grid; gap: 8px; margin: 16px 0 0; padding: 12px 14px;
  background: var(--paper-2); border-left: 3px solid var(--ink-45); border-radius: 2px; }
.forum-meldeweise fieldset { border: 0; margin: 0; padding: 0; display: grid; gap: 6px; }
.forum-meldeweise legend { padding: 0 0 4px; font-size: 13.5px; font-weight: 700; }
.forum-meldeweise label { display: flex; gap: 8px; align-items: baseline; font-size: 14.5px; }
.forum-meldeweise button { justify-self: start; }
.forum-form input[type="file"] { border: 0; padding: 0; font-size: 14px; }

.guthaben h2 { margin: 0 0 6px; font-size: 20px; letter-spacing: -.01em; }
.guthabenliste { list-style: none; margin: 12px 0 0; padding: 0; display: grid; gap: 6px; }
.guthabenliste li { display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: baseline;
  padding-top: 6px; border-top: 1px solid var(--rule-soft); font-size: 14px; }
.guthabenliste b { font-variant-numeric: tabular-nums; }
.guthaben-frist { color: var(--ink-45); }
.ampel-badge { position: absolute; top: 12px; right: 12px; z-index: 2; max-width: 46%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: var(--font-mono); font-size: 12px; font-weight: 600; letter-spacing: .06em; background: var(--paper-2); border: 1.5px solid var(--ink); padding: 3px 8px; }
.blister-art .ampel-badge { top: 14px; right: 14px; }
.blister-buchbar { font-size: 13px; font-weight: 600; color: var(--ink-70); margin: 8px 0 0; letter-spacing: .02em; }
.optionen .opt-hint { margin: 0 0 12px; }
.opt-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
@media (max-width: 1023px) { .opt-grid { grid-template-columns: 1fr; } }
.opt-group { border: 1px solid var(--rule); padding: 12px 14px 8px; margin: 0; min-width: 0; }
.opt-group legend { font-size: 14px; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-70); font-weight: 800; padding: 0 6px; }
.opt-group legend .mono { text-transform: none; letter-spacing: 0; color: var(--violet); }
.opt { display: flex; align-items: baseline; gap: 8px; padding: 6px 0; border-bottom: 1px solid var(--rule-soft); font-size: 14px; cursor: pointer; }
.opt:last-child { border-bottom: 0; }
.opt input { accent-color: var(--effekt-aktuell, var(--violet)); }
.opt-meta { font-size: 14px; font-weight: 700; color: var(--ink-70); }
.opt-summe { margin: 14px 0 0 !important; font-size: 15px !important; color: var(--ink) !important; }
.opt-summe b { font-size: 18px; color: var(--violet); }

.opt-bonus { margin: 10px 0 0 !important; padding: 8px 0 0 10px; border-left: 2px solid var(--ok);
  font-size: 14px !important; line-height: 1.5; color: var(--ink-70) !important; overflow-wrap: break-word; }
.opt-bonus b { color: var(--ink); }

.korb-form { display: inline; margin-top: 6px; }
.korb-form .chip { margin-top: 6px; }
.bausteine { border-top: 1px solid var(--rule); }
.baustein { display: grid; grid-template-columns: 1fr auto; gap: 24px; align-items: center; padding: 16px 0; border-bottom: 1px solid var(--rule); }
@media (max-width: 599px) { .baustein { grid-template-columns: 1fr; gap: 8px; } }
.baustein-titel { font-weight: 800; letter-spacing: -.02em; margin: 0 0 4px; font-size: 16px; }
.baustein-text { margin: 0; color: var(--ink-70); font-size: 14px; max-width: 60ch; }
.baustein-text + .baustein-text { margin-top: 6px; }
.gegenueber { width: 100%; max-width: 820px; border-collapse: collapse; font-size: 14.5px; margin-top: 28px; }
.gegenueber-titel { caption-side: top; text-align: left; font-weight: 800; letter-spacing: -.02em; font-size: 16px; padding-bottom: 8px; }
.gegenueber th, .gegenueber td { text-align: left; vertical-align: top; padding: 10px 12px 10px 0; border-bottom: 1px solid var(--rule); }
.gegenueber thead th { font-size: 13px; font-weight: 700; color: var(--ink-70); }
.gegenueber tbody th { font-weight: 700; width: 30%; }
.gegenueber td { color: var(--ink-70); }
@media (max-width: 599px) {
  .gegenueber { table-layout: fixed; }
  .gegenueber th, .gegenueber td { overflow-wrap: anywhere; -webkit-hyphens: auto; hyphens: auto; }
}
.baustein-preis { text-align: right; font-size: 15px; }
.baustein-preis > .mono:first-child { color: var(--effekt-text, var(--violet)); font-weight: 700; }
@media (max-width: 599px) { .baustein-preis { text-align: left; } }
.korb { border: 1.5px solid var(--ink); background: var(--paper-2); box-shadow: 6px 6px 0 var(--effekt, var(--effekt-aktuell, var(--violet))); }
.korb table { width: 100%; border-collapse: collapse; font-size: 14.5px; }
.korb th { text-align: left; font-size: 14px; letter-spacing: .02em; color: var(--ink-70); font-weight: 800; padding: 12px 16px; border-bottom: 1px solid var(--rule); }
.korb td { padding: 12px 16px; border-bottom: 1px solid var(--rule-soft); vertical-align: top; }
.korb td.zahl, .korb th.zahl { text-align: right; white-space: nowrap; font-family: var(--font-mono); }
.korb .art { font-family: var(--font-mono); font-size: 13px; font-weight: 600; color: var(--ink-70); letter-spacing: .03em; }
.korb .titel { font-weight: 600; }
.korb .text { color: var(--ink-70); font-size: 13px; }
.korb .menge { display: inline-flex; gap: 6px; align-items: center; }
.korb .menge input { width: 52px; font-family: var(--font-mono); padding: 4px 6px; border: 1px solid var(--feld-rand); background: var(--paper-3); }
.korb .aktion { background: none; border: 0; color: var(--ink-70); cursor: pointer; font-family: var(--font-mono); font-size: 13.5px; font-weight: 600; padding: 8px 10px; }
.korb .aktion:hover { color: var(--warn-text); }
.korb tfoot td { border-bottom: 0; padding-top: 16px; font-size: 16px; }
.korb tfoot .gesamt td { font-weight: 800; font-size: 20px; }
.korb-foot { display: flex; justify-content: space-between; align-items: center; gap: 14px; flex-wrap: wrap; padding: 16px; border-top: 1.5px solid var(--ink); }
.korb-foot small { color: var(--ink-70); font-size: 14px; max-width: 46ch; }
.korb-leer { padding: 32px 16px; text-align: center; color: var(--ink-70); }
.korb-hinweis { font-family: var(--font-mono); font-size: 13.5px; font-weight: 700; color: var(--ink); }
.korb-icon { display: block; }

.korb-zahl { font-family: var(--font-mono); font-size: 12px; font-weight: 800; color: var(--ink); background: var(--paper-3); box-shadow: 0 0 0 1.5px var(--ink); border-radius: 999px; min-width: 19px; height: 19px; display: inline-flex; align-items: center; justify-content: center; padding: 0 5px; }
.crew-zahl { font-family: var(--font-mono); font-size: 12px; font-weight: 800; color: var(--ink); background: var(--paper-3); box-shadow: 0 0 0 1.5px var(--ink); border-radius: 999px; height: 19px; display: inline-flex; align-items: center; justify-content: center; padding: 0 6px; }
.crew-leer { color: var(--ink-70); background: transparent; box-shadow: 0 0 0 1.5px var(--ink-45); }
.crew-wort { text-transform: uppercase; letter-spacing: .06em; }
.nav-crew { text-decoration: none; color: var(--ink-70); line-height: 1.2; display: inline-flex; align-items: center; gap: 7px; font-family: var(--font-mono); font-size: 14px !important; letter-spacing: .04em; }
.nav-crew:hover, .nav-crew:focus-visible {
  color: var(--ink); text-decoration: none;
}
.nav-crew[aria-current="page"] { color: var(--ink); box-shadow: inset 0 -3px 0 var(--ink); }

.nav-korb { text-decoration: none; color: var(--ink-70); line-height: 1.2; padding: 7px 11px; display: inline-flex; align-items: center; gap: 7px; font-family: var(--font-mono); font-size: 14px !important; letter-spacing: .04em; }
.korb-mehr { margin-top: 32px; }
.korb-mehr .chips { margin-top: 10px; }
.err { padding: 22px 26px; font-size: 14.5px; color: var(--ink); border-top: 1px solid var(--rule); background: var(--paper-2); }

.products { display: grid; gap: 24px; margin-top: 10px; }
.prow { display: grid; grid-template-columns: auto 1fr auto auto auto; gap: 24px; align-items: baseline; padding: 22px 24px; border: 1.5px solid var(--ink); background: var(--paper-2); box-shadow: 6px 6px 0 var(--effekt); }

.breitkasten {
  display: flex; gap: 24px 32px; align-items: center; justify-content: space-between; flex-wrap: wrap;
  border: 1.5px solid var(--ink); background: var(--paper-2); box-shadow: 6px 6px 0 var(--effekt);
  padding: 22px 24px;
  margin-top: 57px;
}
.breitkasten > .btn { margin-left: auto; flex: 0 1 auto; max-width: 100%; }
@media (min-width: 600px) {
  .breitkasten > .btn, .teaser-zeile .btn, .nichtstun-fuss .btn { min-width: 27ch; justify-content: center; }
}
.breitkasten :is(h2, h3) { margin: 0 0 6px; font-size: 22px; font-weight: 800; letter-spacing: -.02em; display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.breitkasten :is(h2, h3) .pnum { font-size: 19px; font-weight: 800; color: var(--effekt-text, var(--ink)); }
.breitkasten p { margin: 0; max-width: 70ch; font-size: 16px; line-height: 1.55; color: var(--ink-70); }
.kapa :is(h2, h3) { font-size: 30px; font-weight: 900; letter-spacing: -.03em; color: var(--effekt-text, var(--violet)); }
.anfrage-tag { font-size: 13px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-70); border: 1.5px solid var(--ink-45); line-height: 17px; padding: 4px 9px 3px; border-radius: 999px; }
.prow .pname { color: var(--effekt-text, var(--violet)); }
@media (max-width: 1023px) { .prow { grid-template-columns: 1fr; gap: 8px; } }
.pname { font-size: clamp(22px, 3vw, 31px); font-weight: 900; letter-spacing: -.035em; }
.pdesc { font-size: 15px; color: var(--ink-70); line-height: 1.55; max-width: 52ch; margin: 4px 0 0; }
@media (min-width: 1024px) {
  .prow .pdesc { max-width: none; padding-right: 6px; }
  .products .prow:first-child .pdesc { padding-right: 31px; }
}
.pmeta { font-family: var(--font-mono); font-size: 19px; font-weight: 800; color: var(--effekt-text, var(--violet)); white-space: nowrap; text-align: right; align-self: center; line-height: 1.6; }
.prow .korb-form { align-self: center; margin-top: 0; }
.prow .korb-form .btn { margin-top: 0; white-space: nowrap; line-height: inherit; }
@media (max-width: 1023px) { .pmeta { text-align: left; white-space: normal; } }
.pdauer { text-align: right; }
.pnum { font-family: var(--font-mono); font-size: 13px; font-weight: 600; color: var(--ink-45); }
.pband { display: inline-block; font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
  color: var(--auf-farbe); background: var(--effekt-aktuell, var(--violet)); padding: 3px 9px; margin-bottom: 8px; }
.pstreich { display: block; font-size: 15px; font-weight: 600; color: var(--ink-45); text-decoration-thickness: 2px; }
.prow .pnum { font-size: 19px; font-weight: 800; color: var(--effekt-text, var(--ink)); }

.ref-karten { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.ref-karten .ref { min-width: 0; padding: 22px 24px; border: 1.5px solid var(--ink);
  background: var(--paper-2); box-shadow: 6px 6px 0 var(--effekt); }
@media (max-width: 1023px) { .ref-karten { grid-template-columns: 1fr; } }
.ref .kpi { font-family: var(--font-mono); font-weight: 700; font-size: clamp(30px, 4vw, 44px); letter-spacing: -.03em; color: var(--effekt-text, var(--violet)); line-height: 1; font-variant-numeric: tabular-nums; }
.ref .was { color: var(--ink-70); margin: 14px 0 6px; font-family: var(--font-mono); font-size: 13.5px; font-weight: 600; }
.ref .ergebnis { font-size: 16px; font-weight: 600; letter-spacing: -.01em; margin: 0 0 8px; }
.ref .kunde { font-size: 13px; color: var(--ink-70); margin: 0; }
.ref .ref-link { display: inline-block; margin-top: 12px; font-size: 13px; font-weight: 700; color: var(--effekt-text, var(--violet)); }

.team { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--rule); border-left: 1px solid var(--rule); }
@media (max-width: 1023px) { .team { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 599px) { .team { grid-template-columns: 1fr; } }
.person { border-right: 1px solid var(--rule); border-bottom: 1px solid var(--rule); padding: 20px; }
.person .foto {
  aspect-ratio: 4 / 5; background: var(--paper-2); border: 1px solid var(--rule); margin-bottom: 14px;
  display: flex; align-items: flex-end; justify-content: flex-start; padding: 12px;
  font-family: var(--font-mono); font-size: 40px; font-weight: 700; color: var(--ink-45); letter-spacing: -.04em;
  background-image: linear-gradient(to right, var(--rule-soft) 1px, transparent 1px), linear-gradient(to bottom, var(--rule-soft) 1px, transparent 1px);
  background-size: 18px 18px;
}
.person .foto img { width: 100%; height: 100%; object-fit: cover; display: block; }
.person .name { font-weight: 800; letter-spacing: -.02em; font-size: 17px; margin: 0; }
.person .rolle { font-family: var(--font-mono); font-size: 13.5px; font-weight: 600; color: var(--ink-70); margin: 2px 0 8px; }
.person .fokus { font-size: 14px; color: var(--ink-70); margin: 0; line-height: 1.5; }
.team-hint h2 { margin: 0 0 6px; font-size: clamp(22px, 3vw, 31px); letter-spacing: -.035em; font-weight: 900; }
.team-hint .lead { margin: 0; }
.team-hint { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; justify-content: space-between; padding: 22px 0; }

.form { max-width: 640px; border: 1.5px solid var(--ink); background: var(--paper-2); box-shadow: 6px 6px 0 var(--effekt, var(--effekt-aktuell, var(--violet))); }
.form-body { padding: 24px 22px 8px; display: grid; gap: 18px; grid-template-columns: 1fr 1fr; }
.form-body .full { grid-column: 1 / -1; }
@media (max-width: 599px) { .form-body { grid-template-columns: 1fr; } }
.form label { display: block; font-family: var(--font-sans); font-size: 14.5px; font-weight: 700; letter-spacing: .01em; color: var(--ink-70); margin-bottom: 6px; }
.form input, .form select, .form textarea {
  width: 100%; font-family: var(--font-sans); font-size: 16px; color: var(--ink);
  border: 1px solid var(--feld-rand); background: var(--paper-3); padding: 10px 12px; border-radius: var(--radius);
}
.form input:focus-visible, .form select:focus-visible, .form textarea:focus-visible { border-color: var(--effekt-aktuell, var(--violet)); }
.form textarea { min-height: 140px; resize: vertical; }
.form-foot { display: flex; justify-content: space-between; align-items: center; gap: 14px; flex-wrap: wrap; border-top: 1px solid var(--rule); padding: 16px 22px; margin-top: 16px; }
.form-foot small { color: var(--ink-70); font-size: 14px; max-width: 40ch; }
.hp { position: absolute; left: -9999px; }

.success {
  --effekt: var(--violet); --effekt-aktuell: var(--violet);
  --effekt-text: var(--violet-text); --auf-farbe: var(--violet-auf);
  border: 1.5px solid var(--ink); background: var(--paper-2);
  box-shadow: 6px 6px 0 var(--effekt);
  padding: 26px; max-width: 900px;
}
body:is(.leitfarbe-violett, .leitfarbe-pink, .leitfarbe-tuerkis, .leitfarbe-orange, .leitfarbe-gruen, .leitfarbe-gold) .success:not([class*=" f-"]) {
  --effekt-aktuell: inherit; --effekt-text: inherit; --auf-farbe: inherit;
  --effekt: var(--effekt-aktuell);
}

.erfolg-paar { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 30px; align-items: start; }
.erfolg-paar > .success { max-width: none; }
@media (max-width: 1023px) { .erfolg-paar { grid-template-columns: minmax(0, 1fr); } }
.success h3 { margin: 0 0 8px; }
.contact-side { font-size: 15px; color: var(--ink-70); }
.contact-side b { color: var(--ink); }
.contact-side .mono { color: var(--ink); }

.leistung { max-width: 88ch; padding: 6px 0 0; }
.leistung h3 { font-size: 14px; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-70); margin: 18px 0 8px; font-weight: 800; }
.leistung > h3:first-child { margin-top: 0; }
.leistung ul { margin: 0; padding-left: 18px; color: var(--ink-70); font-size: 15px; }
.leistung .zwei { display: grid; grid-template-columns: 1fr 1fr; column-gap: 20px; }
@media (max-width: 599px) { .leistung .zwei { grid-template-columns: 1fr; } }

@media (prefers-reduced-motion: reduce) {
  .price-block.wipe { animation: none; }
  .log .cursor { animation: none; }
  .btn, .chip { transition: none; }
}

.cols-3 > .span2 { grid-column: span 2; }
@media (max-width: 1023px) { .cols-3 > .span2 { grid-column: auto; } }

.blister-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
@media (max-width: 1023px) { .blister-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 599px) { .blister-grid { grid-template-columns: 1fr; } }
.blister {
  --effekt: var(--violet); --effekt-aktuell: var(--violet); --effekt-text: var(--violet);
  position: relative; background: var(--paper-2); border: 1.5px solid var(--ink); border-radius: var(--radius);
  box-shadow: 6px 6px 0 var(--effekt, var(--effekt-aktuell, var(--violet))); padding: 0 0 18px; transition: transform .25s var(--ease-out), box-shadow .25s var(--ease-out);
}
.blister:hover { transform: translate(-2px, -2px) rotate(-.4deg); box-shadow: 9px 9px 0 var(--effekt, var(--effekt-aktuell, var(--violet))); }
.blister-hang { position: absolute; top: 10px; left: 50%; width: 34px; height: 12px; margin-left: -17px; border: 1.5px solid var(--ink); border-radius: 6px; background: var(--paper); }
.blister-head { display: flex; justify-content: space-between; align-items: center; padding: 30px 16px 10px; border-bottom: 1.5px solid var(--ink); }
.blister-brand img { display: block; height: 15px; width: auto; }
.blister:not(.blister-art) .blister-hang { top: 8px; }
.blister:not(.blister-art) .karte-meta,
.blister:not(.blister-art) .ampel-badge { top: 24px; }
.blister:not(.blister-art) .blister-head { padding-top: 58px; }
.blister-nr { font-size: 13px; font-weight: 600; color: var(--ink-70); letter-spacing: .06em; }
.blister-body { display: grid; grid-template-columns: 1fr 64px; gap: 10px; padding: 14px 16px 6px; }
.blister-window {
  aspect-ratio: 3 / 4; border: 1.5px solid var(--ink); background: var(--grund-0); position: relative; overflow: hidden;
  background-image: linear-gradient(to right, color-mix(in srgb, var(--ink) 10%, transparent) 1px, transparent 1px), linear-gradient(to bottom, color-mix(in srgb, var(--ink) 10%, transparent) 1px, transparent 1px);
  background-size: 16px 16px;
}
.blister-window::after { content: ""; position: absolute; inset: 0; box-shadow: inset 6px 6px 0 color-mix(in srgb, var(--ink) 6%, transparent); pointer-events: none; }
.blister-window img { width: 100%; height: 100%; object-fit: contain; object-position: bottom center; display: block; position: relative; }
.blister-silhouette { position: absolute; inset: 0; display: flex; align-items: flex-end; padding: 12px; font-family: var(--font-mono); font-size: 44px; font-weight: 700; color: var(--ink-45); letter-spacing: -.05em; }
.blister-items { display: flex; flex-direction: column; gap: 8px; }
.blister-slot { aspect-ratio: 1; border: 1.5px solid var(--ink); background: var(--paper); display: flex; align-items: center; justify-content: center; padding: 6px; }
.blister-slot img { width: 100%; height: 100%; display: block; }
.blister-slot.leer { border-style: dashed; border-color: var(--rule); background: transparent; }
.blister-foot { padding: 8px 16px 0; }
.blister-name { font-weight: 900; letter-spacing: -.03em; font-size: 20px; margin: 0; }
.blister-sub { font-size: 13px; font-weight: 700; letter-spacing: .08em; color: var(--ink-70); margin: 2px 0 8px; }
.blister-rolle { font-size: 13.5px; font-weight: 600; margin: 0 0 4px; }
.blister-fokus { font-size: 13.5px; color: var(--ink-70); margin: 0; line-height: 1.5; }
@media (prefers-reduced-motion: reduce) { .blister { transition: none; } .blister:hover { transform: none; } }
.blister-art { padding: 0 0 16px; overflow: hidden; }
.blister-art picture, .blister-art img { display: block; width: 100%; height: auto; }
.blister-art .blister-foot { padding-top: 12px; }
.chip.aktiv { border-color: var(--effekt-aktuell, var(--violet)); border-width: 2px; color: var(--ink); background: color-mix(in srgb, var(--effekt-aktuell, var(--violet)) 14%, transparent); }

.gruendung-badges { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 26px; margin-top: 38px; }
.gruendung-text { display: flex; flex-direction: column; align-items: center; text-align: center; margin-top: 25px; }
.eyebrow-maschine { font-size: clamp(19px, 2vw, 25px); margin: 76px 0 0; }
.eyebrow-maschine + .instrument { margin-top: 15px; }
.eyebrow-maschine + .versprechen { margin-top: 22px; }
.versprechen + .instrument { margin-top: 30px; }
.versprechen + .teaser-zeile { margin-top: 30px; }
.versprechen-lead { font-size: clamp(19px, 2.1vw, 27px); font-weight: 800; line-height: 1.25; letter-spacing: -.01em; margin: 0; max-width: 64ch; }
.versprechen-lead em { font-style: normal; color: var(--effekt-text, var(--violet)); }
.versprechen-sub { font-size: 15px; font-weight: 700; color: var(--ink-70); margin: 12px 0 0; }
#kundentool .versprechen-lead { max-width: none; }
.versprechen-liste { list-style: none; margin: 9px 0 0; padding: 0; counter-reset: versprechen;
  display: grid; gap: 6px 26px; grid-template-columns: repeat(auto-fill, minmax(min(340px, 100%), 1fr)); font-size: 13.5px; }
.versprechen-liste li { counter-increment: versprechen; padding-left: 2.6em; text-indent: -2.6em; line-height: 1.45; }
.versprechen-liste li::before { content: counter(versprechen, decimal-leading-zero); display: inline-block; width: 2.6em; text-indent: 0; color: var(--effekt-text, var(--violet)); font-weight: 800; }
.versprechen-liste strong { font-weight: 800; color: var(--effekt-text, var(--violet)); }

.versprechen-karten { gap: 24px; grid-template-columns: 1fr; }
.versprechen-karten li {
  padding: 15px 17px 16px; text-indent: 0; min-width: 0;
  border: 1.5px solid var(--ink); background: var(--paper-2);
  box-shadow: 6px 6px 0 var(--effekt-aktuell, var(--violet));
}
.versprechen-karten li::before {
  display: block; width: auto; margin-bottom: 7px;
  font-size: 17px; letter-spacing: .06em;
}
@media (min-width: 620px)  { .versprechen-karten { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1080px) { .versprechen-karten { grid-template-columns: repeat(4, 1fr); } }

.badge-zwei, .badge-drei { transform: none; }

@media (min-width: 1024px) {
  .hero .wrap {
    display: grid; column-gap: 48px; align-items: start;
    grid-template-columns: auto minmax(0, 1fr) auto;
  }
  .hero .wrap > picture { grid-column: 1 / -1; grid-row: 1; }
  .hero .wrap > .hero-claim { grid-column: 1 / -1; grid-row: 2; }
  .hero .wrap > h1 { grid-column: 1; grid-row: 3; }
  .hero .wrap > .sub { grid-column: 1; grid-row: 4; }
  .hero .gruendung-text { grid-column: 2; grid-row: 3 / 5; align-self: center; justify-self: center; margin: 0; }
  .hero .gruendung-text .benefit { font-size: clamp(18px, 1.6vw, 24px); }
  .hero .gruendung-badges { grid-column: 3; grid-row: 3 / 5; flex-direction: column; flex-wrap: nowrap; justify-content: space-between; gap: 22px; margin: 0; align-self: stretch; width: 160px; }
  .hero .wrap > .eyebrow-maschine { grid-column: 1 / -1; grid-row: 5; }
  .hero .wrap > .versprechen { grid-column: 1 / -1; grid-row: 6; }
  .hero .wrap > .instrument { grid-column: 1 / -1; grid-row: 7; }
  .hero .wrap > .chips,
  .hero .wrap > .demo-herkunft,
  .hero .wrap > .demo-frage { grid-column: 1 / -1; }
  .hero .wrap > .chips { justify-content: space-between; }
}
@media (prefers-reduced-motion: no-preference) {
  .gruendung-badges .badge-link { position: relative; transition: transform .25s var(--ease-out); }
  .gruendung-badges .badge-img { transition: transform .25s var(--ease-out); }
  .gruendung-badges:hover .badge-link { transform: scale(.82); }
  .gruendung-badges .badge-link:hover { transform: scale(1.3); z-index: 2; }
  .gruendung-badges .badge-link:hover .stempel-svg { transform: rotate(-4deg); }
  .gruendung-badges .badge-link:hover .badge-zwei { transform: rotate(3deg); }
  .gruendung-badges .badge-link:hover .badge-drei { transform: rotate(-2deg); }
}
.stempel-svg { flex: 0 0 auto; transform: none; }
.badge-svg, .badge-img { filter: drop-shadow(4px 4px 0 var(--rule)); }
.badge-svg:hover, .badge-img:hover { transform: scale(1.03); transition: transform .25s var(--ease-out); }
.badge-img { height: auto; }
.gruendung-jahre { display: flex; flex-direction: column; align-items: center; gap: 0; margin-bottom: 8px; }
.gruendung-jahre strong { font-size: clamp(52px, 7vw, 88px); font-weight: 900; letter-spacing: -.05em; line-height: .85; color: var(--effekt-aktuell, var(--violet)); font-variant-numeric: tabular-nums; }
.gruendung-jahre .mono { font-size: 26px; letter-spacing: .22em; text-transform: uppercase; color: var(--ink-45); font-weight: 700; }
.benefit {
  display: inline-block; font-weight: 900; letter-spacing: -.03em; font-size: clamp(20px, 2.6vw, 30px); color: var(--ink);
  border-bottom: 4px solid var(--effekt-aktuell, var(--violet)); padding-bottom: 2px; line-height: 1.15;
  white-space: pre-line;
  min-height: 2.4em;
  opacity: 1; transform: none; transition: opacity .26s var(--ease-out), transform .26s var(--ease-out);
}
.benefit.raus { opacity: 0; transform: translateY(10px); }
@media (max-width: 599px) { .gruendung-badges { gap: 15px; margin-top: 33px; } .stempel-svg { width: 104px; height: 116px; } .badge-img { width: 104px; height: auto; } }
@media (prefers-reduced-motion: reduce) { .benefit, .benefit.raus { transition: none; opacity: 1; transform: none; } }

.universum-gruppe-titel {
  display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap;
  margin: 0 0 12px; font-size: 19px; font-weight: 800; letter-spacing: -.02em;
  color: var(--effekt-text, var(--ink));
}
.universum-gruppe-nr {
  font-size: 13px; font-weight: 700; letter-spacing: .04em; padding: 2px 7px; flex: none;
  background: var(--effekt, var(--violet)); color: var(--effekt-auf, var(--grund-0));
}
.universum-nr {
  font-size: 13px; font-weight: 700; letter-spacing: .04em; padding: 2px 6px;
  background: var(--effekt, var(--violet)); color: var(--effekt-auf, var(--grund-0));
}
@media (prefers-reduced-motion: reduce) { .badge-svg:hover, .badge-img:hover { transform: none; } }

.kat-hinweis { margin: -4px 0 0; font-size: 13px; line-height: 1.45; color: var(--ink-70); }

.plan-blatt {
  width: min(880px, calc(100vw - 32px)); max-height: 86vh; padding: 0; overflow: hidden;
  border: 1.5px solid var(--ink); border-radius: var(--radius); background: var(--paper);
  color: var(--ink); box-shadow: 10px 10px 0 var(--effekt-aktuell, var(--violet));
}
.plan-blatt::backdrop { background: color-mix(in srgb, var(--grund-0) 82%, transparent); }
.plan-inhalt { max-height: 86vh; overflow: auto; overscroll-behavior: contain; padding: 22px 24px 26px; }
.plan-zu {
  position: absolute; top: 10px; right: 12px; z-index: 2;
  width: 34px; height: 34px; line-height: 1; font-size: 17px; cursor: pointer;
  border: 1.5px solid var(--rule); border-radius: var(--radius);
  background: var(--paper-2); color: var(--ink);
}
.plan-zu:hover, .plan-zu:focus-visible { border-color: var(--effekt-aktuell, var(--violet)); background: color-mix(in srgb, var(--effekt-aktuell, var(--violet)) 14%, transparent); }
.plan-eyebrow { margin: 0 0 6px; font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--effekt-text, var(--ink-70)); }
.plan-titel { margin: 0 0 8px; font-size: clamp(21px, 2.6vw, 28px); font-weight: 900; letter-spacing: -.03em; }
.plan-brief { margin: 0 0 6px; font-size: 15px; line-height: 1.55; color: var(--ink-70); max-width: 62ch; }
.plan-stand { margin: 0 0 18px; font-size: 13px; color: var(--ink-45); }
.plan-laedt { margin: 0; padding: 28px 0; font-size: 15px; color: var(--ink-70); }
.plan-seite { padding: 26px 0 8px; }
.plan-zurueck { margin-top: 22px; }
@media (max-width: 599px) { .plan-inhalt { padding: 18px 16px 22px; } }

.angebot-preis { max-width: 72ch; }
.angebot-zahl { margin: 0 0 6px; font-size: clamp(21px, 2.8vw, 30px); font-weight: 800; letter-spacing: -.02em; color: var(--effekt-text, var(--ink)); }
.angebot-zahl b { font-variant-numeric: tabular-nums; }
.angebot-neben { margin: 0 0 14px; font-size: 15px; line-height: 1.55; color: var(--ink-70); }
.prow h2 a { color: inherit; text-decoration: none; }
.prow h2 a:hover, .prow h2 a:focus-visible { color: var(--effekt-text, var(--violet)); text-decoration: underline; text-underline-offset: 3px; }

.hero .wrap { --logo-breite: 100%; }
.logo-echt { display: block; width: var(--logo-breite); height: auto; margin: 0 0 35px; }
.hero-claim { margin: 0 0 52px; font-size: clamp(17px, 2.1vw, 27px); font-weight: 700;
  letter-spacing: -.025em; line-height: 1.3; color: var(--ink);
  margin-left: calc(var(--logo-breite) * 0.12182); }
.hero-claim .teil { white-space: nowrap; }
.hero-claim .eins { color: var(--violet-text); }
.hero-claim .zwei { color: var(--pink-text); }
.hero-claim .drei { color: var(--tuerkis-text); }
@media (max-width: 599px) { .hero .wrap { --logo-breite: min(88vw, 360px); }
  .hero-claim { margin-left: 0; } }
@media (max-width: 599px) { .logo-echt { width: min(88vw, 360px); margin: 0 auto 33px; } }

.badge-link { display: inline-block; line-height: 0; }
.badge-link:focus-visible { outline: 2px solid var(--violet); outline-offset: 5px; }
.misslog-titel { max-width: 27ch; }
.misslog-titel .zusammen { white-space: nowrap; }
.zeitleiste { --zl-grund: color-mix(in srgb, var(--effekt-aktuell, var(--violet)) 9%, var(--paper)); position: sticky; top: calc(var(--kopf-h, 57px) - 1px); z-index: 15; border-image: conic-gradient(var(--zl-grund) 0 0) fill 0 // 0 100vmax; padding: 30px 22px 10px; margin: 0 0 16px; transition: top .2s var(--ease-out); }
.zeitleiste::before { content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 1px; border-image: conic-gradient(var(--rule) 0 0) fill 0 // 0 100vmax; pointer-events: none; }
.zeitleiste::after { content: ""; position: absolute; left: 0; right: 0; top: 100%; margin-top: 1px; height: 15px; border-image: conic-gradient(var(--zl-grund) 0 0) fill 0 // 0 100vmax; pointer-events: none; }
.zeitleiste[hidden] { display: none; }
.zeitleiste.oben { top: 0; }
.zl-spur { position: relative; height: 22px; cursor: pointer; }
.zl-spur::before { content: ""; position: absolute; left: 0; right: 0; top: 10px; height: 2px; background: var(--rule); }
.zl-punkt { position: absolute; top: 5px; width: 12px; height: 12px; margin-left: -6px; border-radius: 50%; background: var(--zl-grund); box-shadow: inset 0 0 0 2px var(--effekt-aktuell, var(--violet)); }
.zl-punkt:hover, .zl-punkt:focus-visible { background: var(--effekt-aktuell, var(--violet)); }
.zl-lab { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.zl-tip { position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%); font-size: 13px; font-weight: 800; line-height: 1; color: var(--effekt-text, var(--ink)); background: var(--zl-grund); padding: 2px 3px; opacity: 0; pointer-events: none; }
.zl-punkt:hover .zl-tip, .zl-punkt:focus-visible .zl-tip { opacity: 1; }
.zl-punkt:hover, .zl-punkt:focus-visible { z-index: 2; }
.zl-kreis { position: absolute; left: 0; top: 1px; width: 20px; height: 20px; margin-left: -10px; border-radius: 50%; background: var(--effekt-aktuell, var(--violet)); box-shadow: 0 0 0 3px var(--zl-grund); pointer-events: none; transition: left .35s var(--ease-out); }
.zl-jahr { position: absolute; bottom: 24px; left: 50%; transform: translateX(-50%); font-size: 13px; font-weight: 800; line-height: 1; color: var(--effekt-text, var(--ink)); font-variant-numeric: tabular-nums; }
.zl-marken { position: relative; height: 17px; margin-top: 6px; font-size: 13px; color: var(--ink-70); }
.zl-marke { position: absolute; transform: translateX(-50%); line-height: 17px; }
.misslog-eintrag { scroll-margin-top: calc(var(--kopf-h, 57px) + var(--zl-h, 80px) + 20px); }
@media (max-width: 899px) { .zl-marke[data-jahr="1984"], .zl-marke[data-jahr="1991"], .zl-marke[data-jahr="2000"], .zl-marke[data-jahr="2010"], .zl-marke[data-jahr="2020"] { display: none; } }
@media (max-width: 599px) {
  .zeitleiste { padding: 30px 14px 8px; }
  .zl-scroll { overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; }
  .zl-scroll::-webkit-scrollbar { display: none; }
  .zl-spur { width: 1176px; height: 24px; }
  .zl-spur::before { top: 11px; }
  .zl-marken { width: 1176px; }
  .zl-punkt { top: 0; width: 24px; height: 24px; margin-left: -12px; background: none; box-shadow: none; }
  .zl-punkt::after { content: ""; position: absolute; left: 6px; top: 6px; width: 12px; height: 12px; border-radius: 50%; background: var(--zl-grund); box-shadow: inset 0 0 0 2px var(--effekt-aktuell, var(--violet)); }
  .zl-punkt:hover::after, .zl-punkt:focus-visible::after { background: var(--effekt-aktuell, var(--violet)); }
  .zl-kreis { top: 3px; }
  .zl-tip { bottom: 26px; }
}
@media (prefers-reduced-motion: reduce) { .zeitleiste, .zl-kreis { transition: none; } }
.zl-punkt.aus { opacity: .3; }
.ml-band .pf-auswahl { max-width: 12.5em; text-overflow: ellipsis; }
.ml-band .pf-paar { display: inline-flex; align-items: center; gap: 10px; order: 1; }
@media (min-width: 768px) {
  .ml-band .pf-sortierung:not([for="ml-sortierung"]) { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
}
@media (min-width: 1024px) {
  .ml-band { transition: top .2s var(--ease-out); }
  .ml-band.oben { top: 0; }
  .ml-band > .pf-leiste { padding-bottom: 4px; }
  .ml-band .zeitleiste { --zl-grund: var(--pm-grund); position: relative; top: auto; z-index: auto; margin: 0; padding: 26px 22px 12px; border-image: none; transition: none; }
  .ml-band .zeitleiste::before, .ml-band .zeitleiste::after { display: none; }
}
@media (max-width: 1023px) {
  .ml-band { display: contents; }
  .ml-band::before, .ml-band::after { display: none; }
  .ml-band > .pf-leiste { margin: 28px 0 0; padding: 12px 0; border-image: conic-gradient(var(--pm-grund) 0 0) fill 0 // 0 100vmax; }
}
@media (prefers-reduced-motion: reduce) { .ml-band { transition: none; } }
.misslog-eintrag[hidden], .ml-leer[hidden] { display: none; }
.ml-leer { margin: 16px 0 28px; }
.ml-leer .chip { margin-left: 8px; vertical-align: middle; }
.misslog.ml-kompakt .misslog-eintrag:has(.misslog-heute) .misslog-text { display: none; }
.ml-siegel { float: right; margin: 2px 0 10px 20px; }
.ml-siegel .hexsiegel-seiten { font-size: 11px; }
.ml-tech { margin: 0 0 12px; }
.ml-master { display: flex; flex-wrap: wrap; gap: 4px 16px; margin: 0 0 14px; padding: 0; list-style: none; }
.ml-kopf { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; color: var(--ink-70); text-decoration: none; }
.ml-kopf:hover, .ml-kopf:focus-visible, .ml-kopf.an { color: var(--ink); }
.ml-kopf.an .ml-kopf-name { font-weight: 700; }
.ml-kopf-bild, .ml-kopf-wabe { display: block; clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%); }
.ml-kopf-bild { flex: none; width: 44px; height: 44px; padding: 2px; background: var(--ink); }
.ml-kopf:hover .ml-kopf-bild, .ml-kopf:focus-visible .ml-kopf-bild, .ml-kopf.an .ml-kopf-bild { background: var(--effekt-aktuell, var(--violet)); }
.ml-kopf-wabe { width: 40px; height: 40px; overflow: hidden; background: var(--paper-2); }
.ml-kopf-wabe img { display: block; width: 160px; height: auto; margin: -62px 0 0 -60px; }
.ml-kopf-name { font-size: 12px; letter-spacing: .02em; }
@media print { .ml-master { display: none; } }
@media (max-width: 599px) {
  .ml-siegel { margin-left: 12px; }
  .ml-siegel .hexsiegel-bild { width: 72px; height: 72px; }
  .ml-siegel .hexsiegel-seiten { display: none; }
}
@media print { .ml-siegel { display: none; } }
.misslog { list-style: none; margin: 8px 0 0; padding: 0; position: relative; }
.misslog::before { content: ""; position: absolute; left: 33px; top: 8px; bottom: 8px; width: 2px; background: var(--rule); }
.misslog-eintrag { display: grid; grid-template-columns: 68px 1fr; gap: 16px; padding: 12px 0; position: relative; align-items: start; }
.misslog-icon {
  width: 68px; height: 68px; display: flex; align-items: center; justify-content: center;
  border: 1.5px solid var(--ink); background: var(--paper-2); box-shadow: 3px 3px 0 color-mix(in srgb, var(--grund-0) 40%, transparent);
  position: relative; z-index: 1; transition: transform .2s var(--ease-out);
}
.misslog-eintrag:hover .misslog-icon { transform: rotate(-5deg) scale(1.06); box-shadow: 3px 3px 0 var(--effekt-aktuell, var(--violet)); }
.misslog-icon img { width: 52px; height: 52px; display: block; }
.misslog-spalte { display: flex; flex-direction: column; align-items: center; gap: 6px; }
.misslog-jahr, .misslog-lognr { position: relative; z-index: 1; background: var(--paper); padding: 0 4px; font-size: 13px; line-height: 17px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.misslog-jahr { font-weight: 800; letter-spacing: .04em; color: var(--ink); }
.misslog-lognr { font-weight: 700; letter-spacing: .04em; color: var(--ink-70); }
.misslog-nr { display: block; font-size: 13px; font-weight: 700; letter-spacing: .08em; color: var(--ink-70); margin: 4px 0 2px; }
.misslog-text { margin: 0; font-size: 15.5px; line-height: 1.5; max-width: 72ch; }

.misslog-heute { border-left: 2px solid var(--effekt-aktuell); padding: 2px 0 2px 14px; margin: 12px 0 2px; max-width: 72ch; }
.misslog-heute-kopf { display: block; font-size: 12.5px; font-weight: 800; letter-spacing: .1em; color: var(--effekt-text); }
.misslog-bruecke { margin: 4px 0 10px; font-size: 15px; line-height: 1.5; color: var(--ink-70); }
.branchen-pillen { margin: 18px 0 8px; }
.branchen-pillen-lab { display: block; font-size: 13px; font-weight: 700; letter-spacing: .04em; color: var(--ink-70); margin-bottom: 10px; }
.branchen-pillen ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.branchen-pillen li { font-size: 13px; font-weight: 700; letter-spacing: .04em; line-height: 17px; padding: 7px 14px 6px; border-radius: 999px; color: var(--ink); box-shadow: inset 0 0 0 2px var(--effekt-aktuell, var(--violet)); }
@media (max-width: 599px) { .misslog::before { left: 25px; } .misslog-eintrag { grid-template-columns: 52px 1fr; gap: 12px; } .misslog-icon { width: 52px; height: 52px; } .misslog-icon img { width: 40px; height: 40px; } .misslog-heute { padding-left: 10px; } }
@media (prefers-reduced-motion: reduce) { .misslog-icon { transition: none; } .misslog-eintrag:hover .misslog-icon { transform: none; } }

.kat-preis { font-size: 15px; color: var(--ink); font-weight: 800; }
.kat-fuss { display: flex; flex-direction: column; align-items: stretch; gap: 8px; margin-top: auto; padding-top: 6px; }
.kat-fuss .korb-form { margin: 0; }
.kat-fuss .btn, .kat-fuss .chip { width: 100%; justify-content: center; text-align: center; }
.misslog-heute .kat-fuss { align-items: flex-start; }
.misslog-heute .kat-fuss .btn { width: auto; }
.misslog-aktionen { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }

.teaser-zeile { display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.teaser-zeile .lead { margin: 0; }
.section > .teaser-zeile:first-child { margin-top: 22px; }
.teaser-zeile .btn { flex: 0 0 auto; }
.teaser-kasten { border: 1.5px solid var(--ink); background: var(--paper-2);
  box-shadow: 6px 6px 0 var(--effekt); padding: 22px 24px; }
.section-head + .breitkasten, .section-head + .teaser-kasten { margin-top: 24px; }
.ref-karten + .teaser-kasten { margin-top: 24px; }

.demo-panel { border: 0; background: transparent; padding: 16px 18px 14px; box-shadow: none; }
.demo-kopf { display: flex; align-items: center; gap: 10px; padding: 9px 18px; border-bottom: 1px solid var(--rule); }
.demo-kopf[hidden] { display: none; }
.demo-badge { background: var(--effekt-aktuell, var(--violet)); color: var(--auf-farbe); font-size: 13px; font-weight: 800; letter-spacing: .1em; padding: 4px 10px; }
.demo-tags, .demo-features { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px; margin-top: 8px; }
.demo-tags[hidden], .demo-features[hidden] { display: none; }
.demo-pillen-lab { font-size: 13px; font-weight: 700; letter-spacing: .04em; color: var(--ink-70); line-height: 17px; padding: 7px 4px 6px 0; }
.demo-features { margin-bottom: 8px; }
.demo-tags + .demo-status { margin-top: 8px; }
.demo-tag { font-size: 13px; font-weight: 700; letter-spacing: .04em; border: 0; color: var(--auf-farbe); background: var(--effekt-aktuell, var(--violet)); line-height: 17px; padding: 7px 14px 6px; border-radius: 999px; }
.demo-tag.technik { background: transparent; color: var(--ink); box-shadow: inset 0 0 0 2px var(--effekt-aktuell, var(--violet)); }
.demo-tag.blitz { animation: tag-blitz .4s linear 2; }
@keyframes tag-blitz { 50% { filter: brightness(1.25); } }
.pass-rabatt td { color: var(--ok-text); font-weight: 700; }
.demo-aktion { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.demo-aktion[hidden] { display: none; }
.demo-btn { font-family: var(--font-mono); font-size: 13.5px; font-weight: 700; border: 1.5px solid var(--ink); background: var(--paper-2); color: var(--ink); cursor: pointer; padding: 10px 16px; border-radius: 0; white-space: nowrap; }
@media (max-width: 599px) { .demo-btn { font-size: 12.5px; padding: 10px 11px; } .demo-aktion { gap: 6px; } }

.demo-btn.symbol { display: inline-flex; align-items: center; gap: 0; padding: 10px 12px; }
.demo-btn-zeichen { font-size: 15px; line-height: 1; }
.demo-btn-wort {
  max-width: 0; overflow: hidden; white-space: nowrap; opacity: 0;
  transition: max-width .18s var(--ease-out), opacity .14s var(--ease-out), margin-left .18s var(--ease-out);
}
.demo-btn.symbol:hover .demo-btn-wort,
.demo-btn.symbol:focus-visible .demo-btn-wort { max-width: 14em; opacity: 1; margin-left: 8px; }
@media (prefers-reduced-motion: reduce) { .demo-btn-wort { transition: none; } }

.demo-btn.nehmen:hover { background: var(--ok); border-color: var(--ok); color: var(--hover-schrift); }
.demo-btn.leeren:hover { background: var(--rot); border-color: var(--rot); color: var(--hover-schrift); }
.demo-btn.neustart:hover { background: var(--effekt-aktuell, var(--violet)); border-color: var(--effekt-aktuell, var(--violet)); color: var(--auf-farbe); }
.demo-btn[hidden] { display: none; }
.demo-neustart { display: flex; flex-wrap: wrap; margin-top: 8px; }
.demo-neustart[hidden] { display: none; }
.demo-neustart:not([hidden]) + .demo-aktion { margin-top: 6px; }
.demo-btn.nochmal:hover { background: var(--effekt-aktuell, var(--violet)); border-color: var(--effekt-aktuell, var(--violet)); color: var(--auf-farbe); }
.demo-herkunft { display: flex; align-items: baseline; gap: 8px; margin-top: 10px;
  font-size: 13px; color: var(--ink-70); line-height: 1.5; }
.demo-herkunft[hidden] { display: none; }
.demo-herkunft::before { content: ""; flex: 0 0 auto; width: 7px; height: 7px;
  background: var(--effekt-aktuell, var(--violet)); }

.demo-frage { margin-top: 10px; padding: 10px 0 0 12px; border-top: 1px solid var(--rule);
  border-left: 3px solid var(--effekt-aktuell, var(--violet)); }
.demo-frage[hidden] { display: none; }
.demo-frage-text { font-size: 14px; font-weight: 700; color: var(--ink); margin: 0; }
.demo-frage-warum { font-size: 13.5px; color: var(--ink-70); margin: 4px 0 0; line-height: 1.5; }
.demo-frage-knoepfe { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; --auf-farbe: var(--grund-0); }
.demo-btn.behalten:hover { background: var(--ok); border-color: var(--ok); color: var(--auf-farbe); }
.demo-btn.verwerfen:hover { background: var(--rot); border-color: var(--rot); color: var(--auf-farbe); }
@media (max-width: 599px) { .demo-frage { padding-left: 10px; } .demo-frage-knoepfe { gap: 6px; } }

.demo-titel { font-size: 13px; font-weight: 700; letter-spacing: -.01em; }
.demo-zeile { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.demo-lab { font-size: 17.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--effekt-text, var(--violet)); }
.demo-preis { font-size: clamp(30px, 4.4vw, 44px); font-weight: 800; color: var(--effekt-aktuell, var(--violet)); font-variant-numeric: tabular-nums; letter-spacing: -.02em; }
.demo-preis small { font-size: .5em; color: var(--ink-70); }
.demo-status { font-size: 13.5px; color: var(--ink-70); min-height: 1.4em; margin-top: 2px; }
.demo-hint { font-size: 14px; color: var(--ink); margin-top: 10px; padding: 0 0 2px; font-weight: 600; }

.kapa-wrap { margin: 56px 0 0; }
.kapa-links { display: flex; flex-direction: column; gap: 2px; }
.kapa-lab { font-size: 13.5px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-70); }
.kapa-wert { font-size: clamp(26px, 3.4vw, 40px); font-weight: 900; letter-spacing: -.03em; color: var(--effekt-text, var(--violet)); }
.kapa-wert small { font-size: .45em; font-weight: 700; color: var(--ink); letter-spacing: 0; }
.kapa-detail { font-size: 13.5px; font-weight: 600; color: var(--ink); }

.nichtstun { border: 1.5px solid var(--ink); background: var(--paper-2); padding: 20px; box-shadow: 6px 6px 0 var(--effekt); display: grid; gap: 18px; }
.nichtstun-eingaben { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.nichtstun-eingaben label { display: flex; flex-direction: column; gap: 6px; font-size: 14px; font-weight: 600; color: var(--ink-70); }
.nichtstun-eingaben input { border: 1.5px solid var(--feld-rand); background: var(--paper); padding: 10px 12px; font-family: var(--font-mono); font-size: 18px; color: var(--ink); border-radius: var(--radius); }
.nichtstun-ausgaben { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.ns-kachel { border: 1.5px solid var(--effekt-aktuell, var(--violet)); background: var(--paper); padding: 12px 14px; display: flex; flex-direction: column; gap: 4px; }
.ns-wert { font-size: clamp(22px, 3vw, 34px); font-weight: 700; font-variant-numeric: tabular-nums; color: var(--effekt-text, var(--ink)); }
.ns-lab { font-size: 13px; font-weight: 600; color: var(--ink-70); }
.nichtstun-fuss { display: flex; justify-content: flex-end; }
@media (max-width: 1023px) { .nichtstun-eingaben, .nichtstun-ausgaben { grid-template-columns: 1fr; } }

.mr-grid, .mr-bilanz { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 12px; }
.mr-kachel { border: 1.5px solid var(--ink); background: var(--paper-2); padding: 14px 16px; display: flex; flex-direction: column; gap: 4px; box-shadow: 6px 6px 0 var(--effekt); min-width: 0; }
.mr-zwischen { font-size: 16px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: var(--ink); margin: 26px 0 0; }
.mr-wert { font-size: clamp(22px, 3vw, 34px); font-weight: 800; color: var(--effekt-text, var(--violet)); font-variant-numeric: tabular-nums; min-height: 1.2em; }
.mr-lab { font-size: 13.5px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-70); overflow-wrap: break-word; hyphens: auto; }
.mr-status { font-size: 13px; color: var(--ink-70); margin: 12px 0 0; }
.mr-zusatz { font-size: 13px; color: var(--ink-70); }
@media (max-width: 1023px) { .mr-grid, .mr-bilanz { grid-template-columns: 1fr 1fr; } }

.mission { border: 1.5px solid var(--ink); background: var(--paper-2); padding: 20px 22px; box-shadow: 6px 6px 0 var(--effekt); margin-top: 8px; }
.mission-kopf { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 10px; }
.mission-titel { font-weight: 900; font-size: 18px; letter-spacing: -.02em; }
.mission-status { margin-left: auto; font-size: 13px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-70); border: 1px solid var(--rule); padding: 3px 8px; background: var(--paper); }
.mission-zeile { font-size: 13px; color: var(--ink-70); margin: 2px 0; }
.mission-hinweis { font-size: 14px; color: var(--ink-70); border-top: 1px solid var(--rule); margin: 14px 0 0; padding-top: 10px; }
.meilensteine { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 0; }
.meilenstein { display: grid; grid-template-columns: 24px 1fr auto auto; gap: 10px; align-items: baseline; padding: 9px 0; border-top: 1px solid var(--rule); }
.meilenstein .ms-marker { color: var(--ink-45); }
.meilenstein.fertig .ms-marker,
.meilenstein.laeuft .ms-marker { color: var(--violet); background: var(--grund-0);
  border-radius: 2px; padding: 0 3px; }
.meilenstein .ms-name { font-weight: 700; }
.meilenstein .ms-detail { font-size: 13px; color: var(--ink-70); }
.meilenstein .ms-status { font-size: 13px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-70); }
.meilenstein.laeuft .ms-status { color: var(--violet); font-weight: 700;
  background: var(--grund-0); padding: 1px 6px; border-radius: 2px; }
@media (max-width: 1023px) { .meilenstein { grid-template-columns: 24px 1fr auto; } .meilenstein .ms-detail { grid-column: 2 / -1; } .meilenstein .ms-buchen { grid-column: 1 / -1; } }

.skizze-block {
  --effekt: var(--violet); --effekt-aktuell: var(--violet); --effekt-text: var(--violet);
  border: 1.5px solid var(--ink); background: var(--paper-2); padding: 14px 16px 16px;
  box-shadow: 6px 6px 0 var(--effekt); border-radius: var(--radius); margin-top: 18px;
}
.skizze-kopf { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 10px; }
.skizze-label { font-family: var(--font-mono); font-size: 13px; font-weight: 600; letter-spacing: .06em; color: var(--ink-70); }
.skizze-aktion { display: flex; align-items: center; gap: 10px; }
.skizze-status { font-family: var(--font-mono); font-size: 13px; color: var(--ink-70); }
.skizze-status:empty { display: none; }
.skizze-kopf .btn { padding: 10px 16px; font-size: 13px; }
.skizze-block svg { display: block; width: 100%; height: auto; }

.trumpf-intro { max-width: 60ch; color: var(--ink-70); margin: 0 0 14px; }
.trumpf-punkte { font-family: var(--font-mono); font-size: 24px; font-weight: 800; letter-spacing: .08em; margin: 4px 0 16px; font-variant-numeric: tabular-nums; }
.trumpf-buehne { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; align-items: start; }
.trumpf-hand-label { font-family: var(--font-mono); font-size: 13px; font-weight: 600; letter-spacing: .08em; color: var(--ink-70); margin: 0 0 8px; }
.trumpf-hand { display: grid; gap: 14px; }
.trumpf-karte {
  --effekt: var(--violet); --effekt-aktuell: var(--violet); --effekt-text: var(--violet);
  display: block; width: 100%; text-align: left; cursor: pointer;
  font: inherit; color: var(--ink);
  border: 1.5px solid var(--ink); border-radius: var(--radius);
  background: var(--paper-2); box-shadow: 6px 6px 0 var(--effekt);
  padding: 14px 16px;
}
.trumpf-karte:disabled { cursor: default; }
.trumpf-karte.aktiv { border: 2px solid var(--effekt); padding: 13.5px 15.5px; }
.trumpf-karte.gespielt { opacity: .55; }
.trumpf-offen { cursor: default; }
.trumpf-name { display: block; font-family: var(--font-sans); font-size: 16px; font-weight: 900; letter-spacing: -.02em; line-height: 1.2; }
.trumpf-rolle { display: block; font-size: 13px; color: var(--ink-70); margin: 2px 0 10px; }
.trumpf-wert { display: flex; align-items: baseline; gap: 10px; margin-top: 4px; }
.trumpf-wert-label { flex: 1 1 auto; font-size: 13px; font-weight: 600; letter-spacing: .02em; color: var(--ink-70); white-space: nowrap; }
.trumpf-bloecke { font-size: 14px; letter-spacing: 1.5px; color: var(--effekt-aktuell, var(--violet)); }
.trumpf-zahl { font-size: 13px; font-weight: 700; min-width: 2ch; text-align: right; }
.trumpf-ruecken { display: grid; place-items: center; min-height: 136px; cursor: default; background: var(--paper); }
.trumpf-frage { font-size: 40px; font-weight: 800; color: var(--ink-45); }
.trumpf-kategorien { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
.trumpf-kat-btn {
  font-family: var(--font-mono); font-size: 12px; font-weight: 700; letter-spacing: .03em;
  color: var(--ink); background: var(--paper-2); border: 1.5px solid var(--ink); border-radius: var(--radius);
  box-shadow: 3px 3px 0 color-mix(in srgb, var(--grund-0) 45%, transparent); padding: 9px 14px; cursor: pointer;
}
.trumpf-kat-btn:hover:not(:disabled) { background: var(--violet-tint); }
.trumpf-kat-btn:disabled { opacity: .45; cursor: default; box-shadow: none; }
.trumpf-status { font-family: var(--font-mono); font-size: 12.5px; color: var(--ink-70); min-height: 2.6em; margin: 12px 0 0; max-width: 70ch; }
.trumpf-gewinn {
  --effekt: var(--violet); --effekt-aktuell: var(--violet); --effekt-text: var(--violet);
  border: 2px solid var(--violet); border-radius: var(--radius); background: var(--paper-2);
  box-shadow: 6px 6px 0 var(--effekt); padding: 22px 24px; margin-top: 22px;
}
.trumpf-gewinn-titel { font-family: var(--font-sans); font-size: 19px; font-weight: 900; letter-spacing: -.02em; margin: 0; }
.trumpf-gewinn-text { margin: 0 0 16px; color: var(--ink-70); max-width: 60ch; }
.trumpf-revanche { margin-top: 22px; }
.trumpf-revanche p { margin: 0 0 12px; }
@media (max-width: 1023px) {
  .trumpf-buehne { grid-template-columns: 1fr; }
  .trumpf-punkte { font-size: 20px; }
}

.pass-pille {
  font-family: var(--font-mono); font-size: 13px; letter-spacing: .04em; font-weight: 700;
  color: var(--ink); background: var(--paper); border: 0;
  border-radius: var(--radius); padding: 8px 12px; cursor: pointer; white-space: nowrap;
}
.pass-pille:hover { background: var(--paper-2); }
.pass-pille.pass-voll { background: var(--effekt-aktuell, var(--violet)); color: var(--auf-farbe); }
.pass-stufe { font-size: 12px; font-weight: 700; letter-spacing: .1em; color: var(--ink-70); margin: 12px 0 4px; }
.pass-stufe:first-of-type { margin-top: 6px; }
.pass-link { color: var(--ink); text-decoration: underline; text-decoration-color: var(--effekt-aktuell, var(--violet)); text-decoration-thickness: 2px; text-underline-offset: 3px; font-weight: 700; }
.pass-link:hover { color: var(--effekt-aktuell, var(--violet)); }
.pass-wie { display: block; margin: 1px 0 4px 18px; font-size: 12px; color: var(--ink-70); }
.pass-zeile.erledigt { opacity: .72; }

.ei-punkte { display: inline-flex; align-items: center; gap: 6px; }
.ei-punkt { width: 9px; height: 9px; border-radius: 50%; border: 1.5px solid var(--ink-45); background: transparent; display: inline-block; }
.ei-punkt.an { border-color: transparent; }
.ei-punkt.neu { animation: ei-punkt-neu .5s ease-out 2; }
@keyframes ei-punkt-neu { 50% { transform: scale(1.7); } }
.ei-punkte { cursor: pointer; }
.ei-fahne {
  position: absolute; left: 50%; transform: translateX(-50%); top: 100%; z-index: 30;
  min-width: 260px; max-width: min(420px, calc(100vw - 32px)); padding: 14px; text-align: left;
  background: var(--paper); border: 1.5px solid var(--effekt-aktuell, var(--violet));
  border-radius: var(--radius);
  box-shadow: 5px 5px 0 color-mix(in srgb, var(--grund-0) 45%, transparent);
}
.ei-fahne .ei-text { margin-top: 8px; }
.ei-formel { margin: 10px 0 0; font-size: 22px; font-weight: 800; letter-spacing: .02em; color: var(--effekt-text, var(--ink)); }
.ei-fuss { margin: 10px 0 0; font-size: 13px; line-height: 1.45; color: var(--ink-70); }
.ei-stand { font-size: 11px; letter-spacing: .05em; color: var(--ink-70); margin: 10px 0 0; }
.ei-weg { display: block; margin-top: 12px; font-size: 13.5px; }
@media (max-width: 599px) { .ei-fahne { right: 12px; max-width: calc(100vw - 24px); } }
.ei-tipp { animation: ei-tipp .18s ease-out; }
@keyframes ei-tipp { 50% { transform: scale(1.08); } }
.ei-treffer { animation: ei-treffer 2.6s linear; }
@keyframes ei-treffer {
  0%, 100% { color: var(--effekt-aktuell, var(--violet)); transform: none; }
  15% { color: var(--pink); transform: scale(1.14) rotate(-4deg); }
  40% { color: var(--tuerkis); transform: scale(1.1) rotate(3deg); }
  65% { color: var(--violet); transform: scale(1.12) rotate(-2deg); }
}
.gruendung-text .ei-box { display: none; }
.gruendung-text.ei-offen .gruendung-jahre,
.gruendung-text.ei-offen .benefit { display: none; }
.gruendung-text.ei-offen .ei-box { display: block; align-self: stretch; margin-top: 0; animation: ei-auf .42s var(--ease-out) both; }
@keyframes ei-auf { from { opacity: 0; transform: translateY(10px); } }
@media (prefers-reduced-motion: reduce) { .gruendung-text.ei-offen .ei-box { animation: none; } }
@media (min-width: 1024px) { .hero .gruendung-text.ei-offen { justify-self: stretch; grid-row: 3 / 5; } }
.ei-box { --effekt: var(--effekt-aktuell, var(--violet)); border: 1.5px solid var(--ink); background: var(--paper-2); box-shadow: 6px 6px 0 var(--effekt); padding: 16px 18px; margin-top: 16px; width: 100%; max-width: 340px; margin-inline: auto; text-align: left; }
.ei-titel { margin: 0; font-size: 17px; font-weight: 900; letter-spacing: -.02em; }
.ei-code { margin: 8px 0; font-size: clamp(15px, 1.6vw, 22px); font-weight: 800; letter-spacing: .14em; white-space: nowrap; color: var(--effekt-aktuell, var(--violet)); }
.ei-text { margin: 0; font-size: 14px; color: var(--ink-70); line-height: 1.5; }
.ei-zu {
  display: inline-flex; align-items: center; margin-top: 12px; cursor: pointer;
  font-family: var(--font-mono); font-size: 12.5px; font-weight: 700; letter-spacing: .05em;
  text-transform: uppercase; padding: 9px 14px; border-radius: 0;
  border: 1.5px solid var(--effekt-aktuell, var(--violet)); background: transparent; color: var(--ink);
  transition: .14s;
}
.ei-zu:hover, .ei-zu:focus-visible {
  background: var(--effekt-aktuell, var(--violet)); color: var(--auf-farbe);
}
@media (prefers-reduced-motion: reduce) { .ei-tipp, .ei-treffer { animation: none; } }
.pass-pille.pass-fertig { animation: pass-puls .7s ease-in-out 2; }
@keyframes pass-puls { 0%, 100% { box-shadow: none; } 50% { box-shadow: 3px 3px 0 var(--effekt-aktuell, var(--violet)); } }
@media (prefers-reduced-motion: reduce) { .pass-pille.pass-fertig { animation: none; } }

.pass-panel {
  position: absolute; left: 50%; transform: translateX(-50%); top: 100%; z-index: 30;
  width: min(900px, calc(100vw - 24px)); padding: 14px;
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2px 28px;
  align-content: start;
  background: var(--paper); border: 1.5px solid var(--effekt-aktuell, var(--violet)); border-radius: var(--radius);
  box-shadow: 5px 5px 0 color-mix(in srgb, var(--grund-0) 45%, transparent);
}
.pass-panel > .pass-titel, .pass-panel > .pass-belohnung,
.pass-panel > .pass-rest, .pass-panel > .pass-bedingungen { grid-column: 1 / -1; }
.pass-panel[hidden] { display: none; }
@media (max-width: 767px) { .pass-panel { grid-template-columns: minmax(0, 1fr); } }
.pass-titel {
  font-family: var(--font-mono); font-size: 11px; letter-spacing: .15em; color: var(--ink-70);
  border-bottom: 1px solid var(--rule); padding-bottom: 8px; margin-bottom: 10px;
}
.pass-liste { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.pass-zeile { font-family: var(--font-mono); font-size: 12px; color: var(--ink); }
.pass-zeile b { font-weight: 400; }
.pass-zeile .pass-stempel { color: var(--effekt-aktuell, var(--violet)); }
.pass-zeile .pass-offen { color: var(--ink-45); }
.pass-zeile .pass-haken { margin-left: 6px; font-weight: 800; color: var(--effekt-aktuell, var(--violet)); }
.pass-rest { font-family: var(--font-mono); font-size: 11px; color: var(--ink-70); margin: 10px 0 0; }
.pass-belohnung { margin-top: 10px; padding: 10px; border: 1px solid var(--effekt-aktuell, var(--violet)); border-radius: var(--radius); background: var(--paper-2); }
.pass-belohnung .pass-rest { margin-top: 6px; }
.pass-bedingungen { font-size: 10.5px; line-height: 1.5; color: var(--ink-45); margin: 12px 0 0;
  padding-top: 10px; border-top: 1px solid var(--rule-soft); }
.pass-code { font-family: var(--font-mono); font-size: 13px; font-weight: 700; letter-spacing: .15em; color: var(--effekt-text, var(--violet)); }

.pass-sr {
  position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

@media (max-width: 599px) {
  .pass-panel { right: 12px; }
}

.abo-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 18px; }
.abo { border: 1.5px solid var(--ink); background: var(--paper-2); padding: 18px; box-shadow: 6px 6px 0 var(--effekt, var(--effekt-aktuell, var(--violet))); display: flex; flex-direction: column; gap: 10px; }
.abo h3 { margin: 0; font-size: 18px; letter-spacing: -.02em; }
.abo-preis { font-size: 28px; font-weight: 800; color: var(--effekt-text, var(--violet)); font-variant-numeric: tabular-nums; }
.abo .btn:not(.btn-ghost) { background: var(--effekt-aktuell, var(--violet)); }
.abo .btn:not(.btn-ghost):hover:not(:disabled) { background: color-mix(in srgb, var(--effekt-aktuell, var(--violet)) 60%, var(--hover-tiefe)); color: var(--hover-schrift); }
.abo-preis small { font-size: 13.5px; color: var(--ink-70); font-weight: 400; }
.abo-fakten { list-style: none; margin: 0; padding: 0; display: grid; gap: 5px; font-size: 13.5px; font-weight: 600; color: var(--ink-70); }
.abo-fakten li::before { content: "■ "; color: var(--effekt-aktuell, var(--violet)); }
.abo p { margin: 0; font-size: 13.5px; color: var(--ink-70); line-height: 1.5; flex: 1; }
.abo .btn { align-self: flex-start; }
@media (max-width: 1023px) { .abo-grid { grid-template-columns: 1fr; } }

.price-block { position: relative; }
.siegel {
  position: absolute; right: 26px; top: 14px; transform: rotate(-8deg);
  border: 2px solid color-mix(in srgb, var(--ink) 85%, transparent); color: var(--auf-farbe); padding: 6px 10px; text-align: center; line-height: 1.05;
  font-family: var(--font-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; font-weight: 700;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--ink) 12%, transparent) inset; opacity: .95;
}
.siegel small { display: block; margin-top: 4px; font-size: 12px; font-weight: 700; letter-spacing: .03em; opacity: 1; text-transform: none; }
.price-block.wipe .siegel { animation: stempel .5s var(--ease-out) .7s both; }
@keyframes stempel { from { transform: rotate(-8deg) scale(1.6); opacity: 0; } to { transform: rotate(-8deg) scale(1); opacity: .95; } }
@media (max-width: 599px) { .siegel { position: static; display: inline-block; margin-bottom: 12px; } }

.messgeraet { display: flex; align-items: flex-end; gap: 14px; margin: 10px 0 0; }
.messgeraet svg { display: block; max-width: 100%; height: auto; }
.messwert { font-family: var(--font-mono); font-size: 28px; font-weight: 700; color: var(--violet); line-height: 1; padding-bottom: 6px; }
.messwert small { font-size: 12px; color: var(--ink-45); font-weight: 400; margin-left: 2px; }
.messgeraet .zeiger { transition: none; }
.result-plan .price-block:not(.rueckfrage) { background: var(--effekt-aktuell, var(--violet)); color: var(--auf-farbe); }
.result-plan .messgeraet .zeiger { stroke: var(--effekt-aktuell, var(--violet)); }
.result-plan .messwert, .result-plan .bewertung .mono { color: var(--effekt-text, var(--violet)); }
.messgeraet-fuss { margin: 8px 0 0; font-size: 12.5px; line-height: 1.45; color: var(--ink-45); }
.messgeraet-fuss b { font-weight: 700; color: var(--ink-70); }

.messstand-wrap { margin-top: 23px; }
.kapa-start { margin-top: 75px; }
.kapa-start .breitkasten { margin-top: 0; }
.kapa { --effekt: var(--effekt-aktuell, var(--violet)); }
.messstand { --effekt: var(--effekt-aktuell, var(--violet)); display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px 26px; font-size: 15px; font-weight: 600; color: var(--ink-70); border: 1.5px solid var(--ink); background: var(--paper-2); box-shadow: 6px 6px 0 var(--effekt); padding: 14px 20px; }
.messstand b { color: var(--ink); font-size: 18px; }

.checkliste { margin-top: 32px; }
.fortschritt { height: 8px; border: 1.5px solid var(--ink); background: var(--paper-2); margin: 6px 0 14px; }
.fortschritt-balken { height: 100%; width: 0; background: var(--violet); transition: width .9s var(--ease-out); }
.check-liste { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--rule); }
.check-liste li { display: grid; grid-template-columns: 22px 1fr auto; gap: 12px; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--rule); font-size: 14px; }
.check-liste li.erledigt { color: var(--ink-70); }
.check-liste li.erledigt b { text-decoration: line-through; text-decoration-color: var(--violet); }
.check-mark { color: var(--violet); font-size: 14px; }
.check-grund { display: block; color: var(--ink-70); font-size: 13px; }
@media (max-width: 599px) { .check-liste li { grid-template-columns: 22px 1fr; } .check-liste li > :last-child { grid-column: 2; } }

.gezogen { margin-top: 32px; }
.gezogen-karten { display: flex; flex-wrap: wrap; gap: 14px; }
.minikarte {
  width: 200px; border: 1.5px solid var(--ink); background: var(--paper-2); box-shadow: var(--shadow-violet); padding: 10px 12px 12px;
  animation: ziehen .6s var(--ease-out) both; transform-origin: bottom center;
}
.minikarte:nth-child(2) { animation-delay: .1s; } .minikarte:nth-child(3) { animation-delay: .2s; }
@keyframes ziehen { from { transform: rotateY(90deg) translateY(12px); opacity: 0; } to { transform: none; opacity: 1; } }
.minikarte-kopf { font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-45); border-bottom: 1px solid var(--rule); padding-bottom: 6px; margin-bottom: 8px; }
.minikarte-name { font-weight: 900; letter-spacing: -.02em; font-size: 16px; }
.minikarte-rolle { font-size: 11px; color: var(--violet); margin: 2px 0 8px; }
.minikarte-fuss { font-size: 11px; color: var(--ink-70); }

.karte-meta { position: absolute; top: 12px; left: 12px; z-index: 2; max-width: calc(100% - 132px); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; font-weight: 600; letter-spacing: .02em; color: var(--ink-70); background: var(--paper-2); border: 1.5px solid var(--rule); padding: 4px 7px; }
.blister-origin { font-size: 14px; color: var(--ink-70); margin: 10px 0 0; padding: 8px 10px; border-left: 3px solid var(--violet-text); background: var(--violet-tint); line-height: 1.45; }
.blister-origin .mono { display: block; font-size: 13px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-70); margin-bottom: 2px; }
.blister-upgrade { font-size: 13px; font-weight: 700; color: var(--ink-70); margin: 6px 0 0; letter-spacing: .02em; }
.achievement { display: inline-block; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--ok-text); background: var(--grund-0); border: 1px solid var(--ok); padding: 6px 10px; margin: 0 0 14px; }
.log .achievement-zeile { color: var(--ink); }

@media (prefers-reduced-motion: reduce) {
  .price-block.wipe .siegel { animation: none; }
  .minikarte { animation: none; }
  .fortschritt-balken { transition: none; }
}

.aktion { margin-top: 18px; padding: 12px 16px; border: 1px solid var(--effekt-aktuell, var(--violet)); border-radius: 2px; font-size: 14px; max-width: 760px; }
.aktion strong { display: block; }
.aktion span { color: var(--ink-70); }
.bereich { margin-top: 56px; }
.bereich-kopf h2 { font-size: 26px; letter-spacing: -.03em; margin: 1em 0; }
.bereich-kopf p { color: var(--ink-70); margin-top: 4px; font-size: 15px; }
.preismatrix-titel { margin: 28px 0 10px; font-size: 15px; letter-spacing: -.01em; }
.preismatrix-titel span { font-size: 13px; font-weight: 600; letter-spacing: .04em; color: var(--ink-70); text-transform: uppercase; }
.korb-rahmen { border: 0; box-shadow: none; margin: 0; }
.korb-rahmen > table { width: 100%; min-width: 460px; }

.tabellenrahmen { overflow-x: auto; border: 1.5px solid var(--ink); background: var(--paper-2); box-shadow: 6px 6px 0 var(--effekt, var(--effekt-aktuell, var(--violet))); }
.preismatrix { border-collapse: collapse; width: 100%; min-width: 860px; }
.preismatrix th, .preismatrix td { border: 1px solid var(--rule); vertical-align: top; text-align: left; }
.preismatrix thead th { padding: 10px 12px; background: color-mix(in srgb, var(--ink) 4%, transparent); }
.preismatrix thead th:first-child { width: 260px; }
.stufe-name { display: block; font-size: 13px; font-weight: 700; letter-spacing: -.01em; }
.stufe-zweitname { display: block; font-size: 11.5px; font-weight: 600; color: var(--ink-70); margin-top: 1px; }
.stufe-satz { display: block; font-size: 13px; font-weight: 600; color: var(--ink-70); margin-top: 2px; }
.preismatrix tbody th { padding: 12px; font-weight: 400; }
.paket-name { display: block; font-weight: 900; font-size: 15px; letter-spacing: -.02em; }
.paket-text { display: block; font-size: 14px; color: var(--ink-70); margin-top: 4px; line-height: 1.45; }
.paket-meta { display: block; font-size: 13px; font-weight: 600; color: var(--ink-70); margin-top: 6px; letter-spacing: .02em; }
.paket-meta .spar { color: var(--ink); font-weight: 700; }
.paket-meta .zuschlag { color: var(--effekt-text, var(--gruen)); }
.paket-meta .spanne { color: var(--effekt-text, var(--gruen)); font-weight: 700; }
.paket-meta .paket-vergleich { display: block; margin-top: 4px; }
.preismatrix td { padding: 0; }
.preismatrix td.leer { padding: 12px; color: var(--ink-45); text-align: center; }
.zelle { display: block; width: 100%; height: 100%; padding: 12px; background: none; border: 0; cursor: pointer; text-align: left; font: inherit; color: inherit; }
.zelle:hover, .zelle:focus-visible { background: var(--effekt-aktuell, var(--violet)); color: var(--auf-farbe); }
.zelle:hover .zelle-satz, .zelle:focus-visible .zelle-satz, .zelle:hover .zelle-alt, .zelle:focus-visible .zelle-alt, .zelle:hover .zelle-mehr, .zelle:focus-visible .zelle-mehr { color: color-mix(in srgb, var(--ink) 80%, transparent); }
.zelle-preis { display: block; font-weight: 900; font-size: 16px; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.zelle-satz { display: block; font-size: 13px; font-weight: 600; color: var(--ink-70); margin-top: 2px; }
.zelle-alt { display: block; font-size: 13px; color: var(--ink-70); text-decoration: line-through; margin-top: 2px; }
.zelle-mehr { display: block; font-size: 13px; color: var(--effekt-text, var(--gruen)); margin-top: 2px; }
.paket-fuss { margin: 48px 0 8px; border-top: 1px solid var(--rule); padding-top: 20px; max-width: 760px; }
.paket-fuss h4 { font-size: 14px; letter-spacing: -.01em; }
.paket-fuss ul { margin: 10px 0 0; padding-left: 18px; }
.paket-fuss li { font-size: 13.5px; color: var(--ink-70); margin-bottom: 6px; line-height: 1.5; }
.paket-fuss .klein { font-size: 13.5px; color: var(--ink-70); margin-top: 14px; }
.vh { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
@media (max-width: 1023px) {
  .preismatrix { min-width: 720px; }
  .preismatrix thead th:first-child { width: 200px; }
}

.pm-band { --pm-grund: color-mix(in srgb, var(--effekt-aktuell, var(--violet)) 16%, var(--paper)); position: sticky; top: calc(var(--kopf-h, 0px) - 1px); z-index: 15; margin: 28px 0 0; border-image: conic-gradient(var(--pm-grund) 0 0) fill 0 // 0 100vmax; }
.pm-band::before, .pm-band::after { content: ""; position: absolute; left: 0; right: 0; height: 1px; border-image: conic-gradient(var(--rand) 0 0) fill 0 // 0 100vmax; pointer-events: none; }
.pm-band::before { top: 0; }
.pm-band::after { bottom: 0; }
@media (max-width: 599px) { .pm-band { position: relative; top: auto; } }
.pm-band :focus-visible { outline-color: var(--effekt-text, var(--violet)); }
.pm-schalter { display: inline-flex; flex-wrap: wrap; gap: 6px; }
.pm-knopf { display: inline-flex; align-items: center; height: 40px; padding: 0 12px; flex: none;
  font-family: var(--font-sans); font-size: 15px; font-weight: 800; letter-spacing: -.01em; white-space: nowrap; color: var(--ink); cursor: pointer;
  background: var(--paper-2); border: 1px solid var(--rand); border-radius: var(--radius); }
.pm-knopf[aria-pressed="true"] { background: var(--effekt-aktuell, var(--violet)); border-color: var(--effekt-aktuell, var(--violet)); color: var(--auf-farbe); }
.pm-knopf:hover { border-color: var(--effekt-aktuell, var(--violet));
  background: color-mix(in srgb, var(--effekt-aktuell, var(--violet)) 60%, var(--hover-tiefe)); color: var(--hover-schrift); }
.bereich[hidden], .pm-gruppe[hidden] { display: none; }
.bereich.pm-beste [data-lage="unten"] { display: none; }
.paket-art { display: none; }
.pm-flach .paket-art { display: block; margin-bottom: 4px; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-70); }
.pm-spaltenknopf { display: block; width: 100%; margin: 0; padding: 0; font: inherit; color: inherit; text-align: left; background: none; border: 0; cursor: pointer; }
.pm-spaltenknopf:hover .stufe-name { text-decoration: underline; text-underline-offset: 3px; }
.preismatrix th[aria-sort] .stufe-satz::after { content: " ▲"; color: var(--effekt-text, var(--ink)); }
.preismatrix th[aria-sort="descending"] .stufe-satz::after { content: " ▼"; }
@media (max-width: 767px) {
  .pm-schalter { flex: 1 1 100%; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
  .pm-schalter::-webkit-scrollbar { display: none; }
}
@media print { .pm-band { display: none !important; } }
.mf-etikett { display: inline-flex; align-items: center; flex: none; padding: 0 8px 0 6px; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-70); white-space: nowrap; }
.mf-band ~ .section[hidden], .mf-leer[hidden] { display: none; }
.mf-leer { margin: 36px 0 0; }
.mf-leer .chip { margin-left: 8px; vertical-align: middle; }
.mf-kurz > .section .prose > p:not(:first-of-type) { display: none; }
html:has(#mf-band) .section { scroll-margin-top: calc(var(--kopf-h, 58px) + var(--mf-band-h, 0px) + 10px); }
.team-skala { margin: 16px 0 24px; max-width: 96ch; font-size: 13px; line-height: 1.5; color: var(--ink-70); }
.tm-bereich .blister[hidden], .tm-leer[hidden] { display: none; }
.tm-leer { margin: 12px 0 28px; }
.tm-leer .chip { margin-left: 8px; vertical-align: middle; }
.team-tech { margin: 12px 0 0; }
.team-werte { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 16px; margin: 14px 0 0; }
.team-wert dt { margin: 0; font-size: 12px; font-weight: 700; letter-spacing: .02em; color: var(--ink-70); cursor: help; }
.team-wert dd { display: flex; align-items: center; gap: 8px; margin: 2px 0 0; }
.team-balken { position: relative; flex: 1; height: 6px; background: color-mix(in srgb, var(--ink) 12%, transparent); }
.team-balken::after { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 0; background: var(--effekt, var(--effekt-aktuell, var(--violet))); }
.team-balken[data-w="1"]::after { width: 10%; }
.team-balken[data-w="2"]::after { width: 20%; }
.team-balken[data-w="3"]::after { width: 30%; }
.team-balken[data-w="4"]::after { width: 40%; }
.team-balken[data-w="5"]::after { width: 50%; }
.team-balken[data-w="6"]::after { width: 60%; }
.team-balken[data-w="7"]::after { width: 70%; }
.team-balken[data-w="8"]::after { width: 80%; }
.team-balken[data-w="9"]::after { width: 90%; }
.team-balken[data-w="10"]::after { width: 100%; }
.team-zahl { min-width: 2ch; font-size: 12px; font-weight: 700; text-align: right; color: var(--ink); font-variant-numeric: tabular-nums; }
.team-wert.an dt, .team-wert.an .team-zahl { color: var(--effekt-text, var(--ink)); }
.team-wert.an .team-balken { height: 9px; }
.tm-kompakt .blister picture, .tm-kompakt .blister-hang, .tm-kompakt .blister-head, .tm-kompakt .blister-body,
.tm-kompakt .blister-fokus, .tm-kompakt .blister-origin, .tm-kompakt .blister-upgrade { display: none; }
.tm-kompakt .blister .karte-meta, .tm-kompakt .blister .ampel-badge { position: static; display: inline-flex; max-width: none; margin: 14px 0 0 16px; }
.tm-kompakt .blister .ampel-badge { margin-left: 8px; }
html:has(#tm-band) .blister { scroll-margin-top: calc(var(--kopf-h, 58px) + var(--tm-band-h, 0px) + 10px); }
@media (max-width: 599px) { html:has(#tm-band) .blister { scroll-margin-top: calc(var(--kopf-h, 58px) + 10px); } }
.tm-band #tm-technik { max-width: 240px; text-overflow: ellipsis; }
@media (max-width: 599px) { html:has(#mf-band) .section { scroll-margin-top: calc(var(--kopf-h, 58px) + 10px); } }
.paket-cta p { margin-top: 6px; }
.paket-cta strong { color: var(--ink); font-variant-numeric: tabular-nums; }
.paket-cta .cta-frist { display: block; margin-top: 6px; color: var(--ink); font-weight: 800; }

.preisspiegel { margin: 18px 0 0; border: 1.5px solid var(--rand); background: var(--grund-0); }
.preisspiegel > summary {
  cursor: pointer; padding: 12px 16px; display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap;
  font-family: var(--font-mono); font-size: 12px; letter-spacing: .08em; text-transform: uppercase;
  color: var(--ink); list-style: none;
}
.preisspiegel > summary::-webkit-details-marker { display: none; }
.preisspiegel > summary::before {
  content: "+"; display: inline-block; width: 16px; text-align: center; color: var(--violet); font-weight: 700;
}
.preisspiegel[open] > summary::before { content: "−"; }
.preisspiegel > summary:hover { background: var(--paper); }
.preisspiegel > summary:focus-visible { outline: 2px solid var(--violet); outline-offset: -2px; }
.ps-kurz { margin-left: auto; color: var(--ink-45); letter-spacing: .04em; text-transform: none; }

.ps-tabelle { width: 100%; border-collapse: collapse; border-top: 1px solid var(--rule-soft); }
.ps-tabelle th, .ps-tabelle td { padding: 8px 16px; text-align: left; vertical-align: baseline; font-weight: 400; }
.ps-tabelle th[scope="row"] { font-size: 13px; color: var(--ink-70); }
.ps-weg { font-size: 11px; color: var(--ink-45); white-space: nowrap; }
.ps-betrag, .ps-stand { text-align: right; font-size: 12px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ps-betrag { color: var(--ink-70); }
.ps-stand { color: var(--ink); font-weight: 600; }
.ps-warum { display: block; font-size: 11px; line-height: 1.45; color: var(--ink-45); margin-top: 2px; }

.ps-zwischen th[scope="row"], .ps-zwischen .ps-stand { color: var(--ink); font-weight: 700; }
.ps-zwischen td, .ps-zwischen th { border-top: 1px solid var(--rule); }
.ps-nachlass th[scope="row"] { color: var(--violet); }
.ps-nachlass .ps-betrag { color: var(--violet); }
.ps-hinweis th[scope="row"] { color: var(--ink-45); font-size: 12px; }
.ps-hinweis .ps-stand { color: var(--ink-45); font-weight: 400; }
.ps-ergebnis th, .ps-ergebnis td { border-top: 1.5px solid var(--ink); padding-top: 12px; }
.ps-ergebnis th[scope="row"], .ps-ergebnis .ps-stand { color: var(--ink); font-weight: 700; font-size: 14px; }
.ps-zahlung th[scope="row"] { color: var(--ink-70); }
.ps-zahlung:first-of-type td, .ps-zahlung:first-of-type th { border-top: 1px solid var(--rule-soft); }
.ps-tabelle tr:last-child .ps-stand { color: var(--tuerkis); font-weight: 700; }

@media (max-width: 599px) {
  .ps-tabelle, .ps-tabelle tbody, .ps-tabelle tr { display: block; }
  .ps-tabelle thead { display: none; }
  .ps-tabelle tr { display: grid; grid-template-columns: 1fr auto; gap: 0 10px; padding: 8px 14px; }
  .ps-tabelle th, .ps-tabelle td { padding: 0; }
  .ps-tabelle th[scope="row"] { grid-column: 1; }
  .ps-stand { grid-column: 2; grid-row: 1; }
  .ps-weg { grid-column: 1 / -1; white-space: normal; }
  .ps-betrag { grid-column: 1 / -1; text-align: left; }
  .ps-betrag:empty { display: none; }
}

.chip.beantwortet { border-color: var(--gold); color: var(--gold-text); }

#besTrend { display: block; width: 100%; height: 60px; }

@keyframes bes-puls { 0% { opacity: .35; } 100% { opacity: 1; } }

@media print {
  .next-actions { display: none !important; }
}

.modus-form { display: inline-flex; margin: 0; }

.modus-knopf {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  justify-content: center;
  background: none;
  border: 0;
  color: var(--ink-70);
  position: relative;
  padding: 7px 9px;
  cursor: pointer;
  font-family: var(--font-sans);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.2;
  min-width: 24px;
  min-height: 24px;
}

.modus-knopf:hover, .modus-knopf:focus-visible {
  color: var(--ink);
}

.ikon-mond { display: none; }
body.hell .ikon-sonne { display: none; }
body.hell .ikon-mond { display: inline; }
.modus-wort.ikon-mond { display: none; }
body.hell .modus-wort.ikon-mond { display: inline; }
body.hell .modus-wort.ikon-sonne { display: none; }

.konto-anmeldung { max-width: 34rem; }
.konto-form { display: flex; flex-direction: column; gap: .6rem; }

.konto-code {
  font-size: 1.6rem;
  letter-spacing: .28em;
  text-transform: uppercase;
  padding: .6em .7em;
  background: var(--grund-0);
  color: var(--ink);
  border: 1px solid var(--feld-rand);
  border-radius: 2px;
  width: 100%;
}

.konto-code::placeholder { color: var(--ink-45); letter-spacing: .28em; }
.feld-label { font-weight: 700; text-transform: uppercase; letter-spacing: .06em; font-size: .82rem; }
.feld-hilfe { color: var(--ink-70); font-size: .9rem; margin: 0; }

.konto-tabelle { width: 100%; border-collapse: collapse; margin: 1.5rem 0; }
.konto-tabelle th, .konto-tabelle td { text-align: left; padding: .7rem .6rem; border-bottom: 1px solid var(--rand); }
.konto-tabelle th { text-transform: uppercase; letter-spacing: .06em; font-size: .8rem; color: var(--ink-70); }
.konto-tabelle td.mono { font-variant-numeric: tabular-nums; }

.stand { font-size: .85rem; font-weight: 700; padding: .2em .55em; border: 1px solid currentColor; border-radius: 2px; }
.stand.fertig { color: var(--gruen-text); }
.stand.laeuft { color: var(--tuerkis-text); }
.stand.offen  { color: var(--ink-70); }

.konto-abmelden { margin-top: 2rem; }
.btn-leise { background: none; border: 1px solid var(--rand); color: var(--ink-70); font: inherit;
  padding: .5em 1em; border-radius: 2px; cursor: pointer; min-height: 24px; }
.btn-leise:hover { color: var(--ink); border-color: var(--ink-45); }
a.btn-leise { display: inline-block; text-decoration: none; }

.farbe-violett { --effekt: var(--violet);  --effekt-auf: var(--violet-auf);  --effekt-text: var(--violet-text); }
.farbe-pink    { --effekt: var(--pink);    --effekt-auf: var(--pink-auf);    --effekt-text: var(--pink-text); }
.farbe-tuerkis { --effekt: var(--tuerkis); --effekt-auf: var(--tuerkis-auf); --effekt-text: var(--tuerkis-text); }
.farbe-orange  { --effekt: var(--orange);  --effekt-auf: var(--orange-auf);  --effekt-text: var(--orange-text); }
.farbe-gruen   { --effekt: var(--gruen);   --effekt-auf: var(--gruen-auf);   --effekt-text: var(--gruen-text); }
.farbe-gold    { --effekt: var(--gold);    --effekt-auf: var(--gold-auf);    --effekt-text: var(--gold-text); }

.konto-h3 { margin-top: 2.5rem; text-transform: uppercase; letter-spacing: .06em; font-size: .95rem; }
.konto-zeilenform { margin: 0; }

.cbanner {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 90;
  background: var(--grund-0);
  border-top: 2px solid var(--ink);
  box-shadow: 0 -6px 0 color-mix(in srgb, var(--grund-0) 18%, transparent);
}

.cbanner-in {
  max-width: 1180px;
  margin: 0 auto;
  padding: 18px 24px;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 18px 28px;
  align-items: center;
}

.cbanner-titel {
  font-size: 17px; font-weight: 900; letter-spacing: -.02em;
  margin: 0 0 6px; color: var(--ink);
}

.cbanner-text p { margin: 0; font-size: 14px; line-height: 1.55; color: var(--ink-70); max-width: 78ch; }
.cbanner-mehr { margin-top: 8px !important; font-size: 12.5px; }
.cbanner-mehr a { color: var(--tuerkis-text); }

.cbanner-knoepfe { display: flex; gap: 12px; flex-wrap: wrap; }
.cbanner-knoepfe form { margin: 0; }

.cbanner-btn {
  width: 208px;
  justify-content: center;
  min-height: 46px;
}

@media (max-width: 1023px) {
  .cbanner-in { grid-template-columns: 1fr; padding: 16px 15px; gap: 14px; }
  .cbanner-knoepfe { flex-direction: column; }
  .cbanner-btn { width: 100%; min-width: 0; }
  .cbanner { max-height: 72vh; overflow-y: auto; }
}

.foot-widerruf { display: inline; margin: 0; }
.foot-widerruf button {
  background: none; border: 0; cursor: pointer;
  font: inherit; color: inherit; text-decoration: underline;
  display: inline-flex; align-items: center; min-height: 24px; padding: 2px 0;
}
.foot-widerruf button:hover { color: var(--ink); }
.foot-widerruf button:focus-visible { outline: 2px solid var(--violet); outline-offset: 3px; }

.speicher-tabelle td.js-nein { color: var(--ink-45); }

.kasse-raster { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 34px; align-items: start; }
.kasse-form .feld { display: block; margin: 0 0 18px; }
.kasse-form label { display: block; font-family: var(--font-mono); font-size: 12px; letter-spacing: .08em;
  text-transform: uppercase; color: var(--ink-70); margin-bottom: 6px; font-weight: 600; }
.kasse-form input { width: 100%; }
.kasse-form input:not([type=checkbox]):not([type=hidden]) {
  font-family: var(--font-sans); font-size: 16px; color: var(--ink);
  border: 1px solid var(--feld-rand); background: var(--paper-3); padding: 10px 12px; border-radius: var(--radius);
}
.kasse-form input:not([type=checkbox]):not([type=hidden]):focus-visible { border-color: var(--violet); }
.feld-hinweis { display: block; font-family: var(--font-mono); font-size: 12px; color: var(--ink-45); margin-top: 5px; }
.kasse-recht { margin: 22px 0 18px; color: var(--ink-70); }

.feld-mail { display: block; margin: 0; }
.next .feld-mail, .next .kasse-recht { flex: 0 0 100%; max-width: none; margin: 0; }
.feld-mail label { display: block; font-family: var(--font-mono); font-size: 12px; letter-spacing: .08em;
  text-transform: uppercase; color: var(--ink-70); margin-bottom: 6px; font-weight: 600; }
.feld-mail input {
  width: 100%; max-width: 480px; font-family: var(--font-sans); font-size: 16px; color: var(--ink);
  border: 1px solid var(--feld-rand); background: var(--paper-3); padding: 10px 12px; border-radius: var(--radius);
}
.feld-mail input:focus-visible { border-color: var(--violet); }

.kasse-summe { border: 1px solid var(--rand); background: var(--grund-0); padding: 20px 22px; }
.kasse-summe h2 { font-size: 17px; font-weight: 900; letter-spacing: -.02em; margin: 0 0 12px; }
.kasse-posten { list-style: none; margin: 0 0 14px; padding: 0; font-size: 13px; color: var(--ink-70); }
.kasse-posten li { padding: 4px 0; border-bottom: 1px solid var(--rule-soft); }
.kasse-tabelle { width: 100%; border-collapse: collapse; }
.kasse-tabelle th { text-align: left; padding: 8px 0; font-weight: 700; font-size: 14px; }
.kasse-tabelle td.zahl { text-align: right; font-family: var(--font-mono); font-weight: 800;
  font-variant-numeric: tabular-nums; white-space: nowrap; }
.kasse-tabelle tr:last-child th, .kasse-tabelle tr:last-child td { border-top: 2px solid var(--ink); padding-top: 10px; }

.zugangscode { font-size: clamp(26px, 5vw, 38px); font-weight: 800; letter-spacing: .16em;
  color: var(--effekt-aktuell, var(--violet)); margin: 12px 0 18px; user-select: all; }

@media (max-width: 1023px) {
  .kasse-raster { grid-template-columns: 1fr; gap: 24px; }
  .kasse-summe { order: -1; }
}

.feld-bestaetigung { border: 1px solid var(--rand); background: var(--grund-0); padding: 14px 16px; margin: 22px 0 0; }
.feld-bestaetigung .opt { display: grid; grid-template-columns: 24px 1fr; gap: 10px; align-items: start;
  cursor: pointer; font-size: 14px; line-height: 1.5;
  overflow-wrap: anywhere; }
.feld-bestaetigung input[type=checkbox] { width: 20px; height: 20px; margin: 1px 0 0; accent-color: var(--effekt-aktuell, var(--violet)); }
.feld-bestaetigung .field-validation-error { display: block; margin-top: 8px; }

.agb-entwurf {
  border: 2px solid var(--gold); border-left-width: 6px;
  background: var(--grund-0); padding: 20px 24px; margin: 0 0 34px;
}
.agb-entwurf h2 { margin: 0 0 10px; font-size: 18px; font-weight: 900; letter-spacing: -.02em; }
.agb-entwurf p { margin: 0 0 10px; max-width: 74ch; }
.agb-entwurf p:last-child { margin-bottom: 0; color: var(--ink-70); }

.chat {
  position: fixed; right: 16px; bottom: var(--chat-unten, 16px); z-index: 80;
  display: flex; flex-direction: column; align-items: flex-end; gap: 10px;
  max-width: calc(100vw - 32px);
  pointer-events: none;
}
.chat > * { pointer-events: auto; }
.chat[hidden] { display: none; }

.chat-knopf {
  position: relative; display: inline-flex; align-items: center; gap: 8px;
  min-height: 44px; padding: 11px 16px;
  font-family: var(--font-sans); font-size: 16px; font-weight: 800; line-height: 1;
  background: var(--effekt-aktuell, var(--violet)); color: var(--auf-farbe);
  border: 0; border-radius: var(--radius); cursor: pointer;
}
.chat-knopf:hover { background: color-mix(in srgb, var(--effekt-aktuell, var(--violet)) 60%, var(--hover-tiefe)); color: var(--hover-schrift); }

.chat-punkt {
  position: absolute; top: -6px; right: -6px; width: 14px; height: 14px;
  background: var(--rot); border: 2px solid var(--grund-0); border-radius: var(--radius);
}
.chat-punkt[hidden] { display: none; }

.chat-fenster {
  display: flex; flex-direction: column;
  width: min(400px, calc(100vw - 32px));
  height: min(600px, calc(100dvh - var(--chat-unten, 16px) - 96px));
  background: var(--paper-2); color: var(--ink);
  border: 1.5px solid var(--ink);
  box-shadow: 6px 6px 0 var(--effekt-aktuell, var(--violet));
}
.chat-fenster[hidden] { display: none; }

.chat-kopf {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 12px;
  padding: 12px 14px; border-bottom: 1px solid var(--rule);
}
.chat-titel { margin: 0; font-size: 16px; font-weight: 900; letter-spacing: -.01em; color: var(--ink); }
.chat-ki { margin: 4px 0 0; font-size: 13px; line-height: 1.4; color: var(--ink-70); }

.chat-zu {
  flex: none; display: inline-flex; align-items: center; justify-content: center;
  width: 32px; height: 32px; padding: 0;
  background: transparent; color: var(--ink-70); border: 1px solid var(--rand); border-radius: var(--radius); cursor: pointer;
}
.chat-zu:hover { background: color-mix(in srgb, var(--effekt-aktuell, var(--violet)) 60%, var(--hover-tiefe)); border-color: var(--effekt-aktuell, var(--violet)); color: var(--hover-schrift); }

.chat-verlauf {
  flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain;
  display: flex; flex-direction: column; gap: 10px; padding: 12px 14px;
}

.chat-beitrag {
  max-width: 88%; padding: 8px 10px;
  background: var(--paper); border: 1px solid var(--rand); border-radius: var(--radius);
}
.chat-beitrag.rolle-besucher { align-self: flex-end; border-color: var(--effekt-aktuell, var(--violet)); }
.chat-beitrag.rolle-mensch { border-left: 4px solid var(--effekt-aktuell, var(--violet)); }
.chat-beitrag.entwurf { border-style: dashed; }

.chat-wer { display: block; margin-bottom: 2px; font-family: var(--font-mono); font-size: 13px; font-weight: 700; color: var(--ink-70); }
.chat-text { margin: 0; font-size: 15px; line-height: 1.5; color: var(--ink); white-space: pre-wrap; overflow-wrap: anywhere; }
.chat-text a { color: inherit; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.chat-text a:hover, .chat-text a:focus-visible { color: var(--ink); text-decoration-color: var(--effekt-aktuell, var(--violet)); text-decoration-thickness: 2px; }
.chat-schreibt { display: block; font-size: 13px; color: var(--ink-45); }

.chat-status { margin: 0; padding: 8px 14px; font-size: 13px; line-height: 1.4; color: var(--ink-70); border-top: 1px solid var(--rule); }
.chat-status:empty { padding: 0; border-top: 0; }

.chat-form { margin: 0; padding: 10px 14px 8px; border-top: 1px solid var(--rule); display: flex; flex-direction: column; gap: 8px; }
.chat-form textarea {
  width: 100%; min-height: 58px; max-height: 140px; resize: none; padding: 8px 10px;
  font: inherit; font-size: 16px; line-height: 1.45;
  background: var(--grund-0); color: var(--ink); border: 1px solid var(--feld-rand); border-radius: var(--radius);
}
.chat-fuss { display: flex; align-items: center; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
.chat-senden { font-size: 15px; padding: 10px 18px; }

.chat-mensch {
  margin-right: auto; padding: 9px 12px;
  font-family: var(--font-sans); font-size: 14px; font-weight: 700;
  background: transparent; color: var(--ink);
  border: 1.5px solid var(--effekt-aktuell, var(--violet)); border-radius: var(--radius); cursor: pointer;
}
.chat-mensch:hover:not(:disabled) { background: color-mix(in srgb, var(--effekt-aktuell, var(--violet)) 60%, var(--hover-tiefe)); color: var(--hover-schrift); }
.chat-mensch:disabled { opacity: .5; cursor: not-allowed; }
.chat-mensch[hidden] { display: none; }

.chat-recht { margin: 0; padding: 0 14px 10px; font-size: 13px; line-height: 1.4; color: var(--ink-45); }
.chat-recht a { color: var(--ink-70); }

.kontakt-chat {
  padding: 0; background: none; border: 0; cursor: pointer;
  font: inherit; font-family: var(--font-mono); color: inherit; text-decoration: underline;
}
.kontakt-chat:hover { color: var(--ink); text-decoration-color: var(--effekt-aktuell, var(--violet)); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.kontakt-chat[hidden] { display: none; }

@media print {
  .chat { display: none !important; }
}

.f-violett,
.prow:nth-child(6n+1),
.blister:nth-of-type(6n+1),
.mr-kachel:nth-child(6n+1),
.trumpf-karte:nth-of-type(6n+1) {
  --effekt: var(--violet); --effekt-aktuell: var(--violet);
  --effekt-text: var(--violet-text); --auf-farbe: var(--violet-auf);
}
.f-pink,
.prow:nth-child(6n+2),
.blister:nth-of-type(6n+2),
.mr-kachel:nth-child(6n+2),
.trumpf-karte:nth-of-type(6n+2),
.mission {
  --effekt: var(--pink); --effekt-aktuell: var(--pink);
  --effekt-text: var(--pink-text); --auf-farbe: var(--pink-auf);
}
.f-tuerkis,
.prow:nth-child(6n+3),
.blister:nth-of-type(6n+3),
.mr-kachel:nth-child(6n+3),
.trumpf-karte:nth-of-type(6n+3),
.cta-tuerkis {
  --effekt: var(--tuerkis); --effekt-aktuell: var(--tuerkis);
  --effekt-text: var(--tuerkis-text); --auf-farbe: var(--tuerkis-auf);
}
.f-orange,
.prow:nth-child(6n+4),
.blister:nth-of-type(6n+4),
.mr-kachel:nth-child(6n+4),
.trumpf-karte:nth-of-type(6n+4),
.nichtstun {
  --effekt: var(--orange); --effekt-aktuell: var(--orange);
  --effekt-text: var(--orange-text); --auf-farbe: var(--orange-auf);
}
.f-gruen,
.prow:nth-child(6n+5),
.blister:nth-of-type(6n+5),
.mr-kachel:nth-child(6n+5),
.trumpf-karte:nth-of-type(6n+5),
.pilot {
  --effekt: var(--gruen); --effekt-aktuell: var(--gruen);
  --effekt-text: var(--gruen-text); --auf-farbe: var(--gruen-auf);
}
.f-gold,
.prow:nth-child(6n),
.blister:nth-of-type(6n),
.mr-kachel:nth-child(6n),
.trumpf-karte:nth-of-type(6n) {
  --effekt: var(--gold); --effekt-aktuell: var(--gold);
  --effekt-text: var(--gold-text); --auf-farbe: var(--gold-auf);
}

body.hell .prow { --effekt-text: var(--effekt-aktuell); }

.hexsiegel-tafel { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 28px; }
.hexsiegel { display: flex; flex-direction: column; align-items: center; flex: none; }

.hexsiegel-scheibe { position: relative; perspective: 600px; }
.hexsiegel-flaeche { backface-visibility: hidden; transform-style: preserve-3d;
  transition: transform .4s cubic-bezier(.4, 0, .2, 1); }
.hexsiegel-hinten { position: absolute; inset: 0; transform: rotateY(180deg); }
body.siegel-technik .hexsiegel-vorn { transform: rotateY(-180deg); }
body.siegel-technik .hexsiegel-hinten { transform: rotateY(0deg); }
.hexsiegel-bild { display: block; overflow: visible; }

.hexsiegel-seiten { display: flex; align-items: center; gap: 5px; margin: 8px 0 0;
  font-size: 13px; font-weight: 600; color: var(--ink-45); }
.hexsiegel-punkte { display: flex; gap: 6px; margin-right: 3px; }
.hexsiegel-punkte span { width: 6px; height: 6px; border-radius: 50%; background: var(--ink-45); opacity: .35; }
.hexsiegel-punkte span:first-child { opacity: 1; }
body.siegel-technik .hexsiegel-punkte span:first-child { opacity: .35; }
body.siegel-technik .hexsiegel-punkte span:last-child { opacity: 1; }

.hexsiegel-legende { list-style: none; margin: 10px 0 0; padding: 0; font-size: 12px; line-height: 1.5;
  display: grid; grid-template-columns: repeat(2, minmax(0, max-content)); gap: 0 26px; justify-content: start; }
.hexsiegel-legende-hinten { display: none; }
body.siegel-technik .hexsiegel-legende-vorn { display: none; }
body.siegel-technik .hexsiegel-legende-hinten { display: grid; }
.hexsiegel-zeile { display: grid; grid-template-columns: max-content 18px max-content; gap: 0 10px;
  align-items: center; padding: 2px 0; }
.hexsiegel-ikone { align-self: center; justify-self: center; }
.hexsiegel-name { white-space: nowrap; font-weight: 600; }
.hexsiegel-wert { font-size: 16px; font-weight: 800; text-align: right; min-width: 2ch;
  font-variant-numeric: tabular-nums; color: var(--effekt-text, var(--ink)); }
.hexsiegel-druckzeile { display: none; }

.korb-siegel { float: left; margin: 0 12px 6px 0; }
.korb-siegel .hexsiegel-seiten { font-size: 11px; }

.hexsiegel-drehen { display: block; padding: 0; border: 0; background: none; cursor: pointer;
  perspective: 600px; transition: transform .18s var(--ease-out); }
.hexsiegel-drehen:hover { transform: translateY(-1px); }
.hexsiegel-drehen:hover .hexsiegel-bild polygon[stroke] { stroke: var(--ink-45); }
.hexsiegel-wort { font: inherit; padding: 0 2px; border: 0; background: none; cursor: pointer;
  color: var(--ink-45); }
.hexsiegel-wort:hover { color: var(--ink); text-decoration: underline; text-underline-offset: 3px; }
.hexsiegel-wort-vorn { color: var(--ink); font-weight: 800; }
body.siegel-technik .hexsiegel-wort-vorn { color: var(--ink-45); font-weight: 600; }
body.siegel-technik .hexsiegel-wort-hinten { color: var(--ink); font-weight: 800; }
@media (prefers-reduced-motion: reduce) {
  .hexsiegel-drehen { transition: none; }
  .hexsiegel-drehen:hover { transform: none; }
}

html:not(.js) .nur-js { display: none !important; }

.pf-filter {
  position: sticky; top: calc(var(--kopf-h, 0px) - 1px); z-index: 15;
  margin-top: 28px; padding: 10px 0;
  background: color-mix(in srgb, var(--effekt-aktuell, var(--violet)) 16%, var(--paper));
  border-top: 1px solid var(--rand); border-bottom: 1px solid var(--rand);
}
@media (max-width: 599px) { body:has(.bar.weg) .pf-filter { top: 0; } }
.pf-leiste { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; padding: 12px 0; }
.pf-bereich :focus-visible { outline-color: var(--effekt-text, var(--violet)); }
html:has(#portfolio-karten) { scroll-padding-top: calc(var(--kopf-h, 58px) + var(--pf-filter-h, 0px) + 12px); }
html:has(#portfolio-karten) :target { scroll-margin-top: 0; }

.pf-segmente, .pf-reiter { display: inline-flex; gap: 4px; padding: 4px; background: var(--paper-2);
  border: 1px solid var(--rand); border-radius: var(--radius); max-width: 100%; }
.pf-segmente { overflow-x: auto; scrollbar-width: none; }
.pf-segmente::-webkit-scrollbar { display: none; }
.pf-segment { display: inline-flex; align-items: center; gap: 7px; height: 40px; padding: 0 12px; flex: none;
  font-family: var(--font-sans); font-size: 15px; font-weight: 800; letter-spacing: -.01em; white-space: nowrap;
  color: var(--ink); background: transparent; border: 0; border-radius: var(--radius); cursor: pointer; }
.pf-zahl { font-family: var(--font-mono); font-size: 13px; font-weight: 500; color: var(--ink-70); }
.pf-segment[aria-pressed="true"], .pf-segment[aria-selected="true"] { background: var(--effekt-aktuell, var(--violet)); color: var(--auf-farbe); }
.pf-segment[aria-pressed="true"] .pf-zahl { color: inherit; }
.pf-segment:hover { background: color-mix(in srgb, var(--effekt-aktuell, var(--violet)) 60%, var(--hover-tiefe)); color: var(--hover-schrift); }
.pf-segment:hover .pf-zahl { color: inherit; }

.pf-filterknopf { display: inline-flex; align-items: center; gap: 10px; height: 48px; padding: 0 16px; flex: none;
  font-family: var(--font-sans); font-size: 15px; font-weight: 800; color: var(--ink); cursor: pointer;
  background: var(--paper-2); border: 1px solid var(--rand); border-radius: var(--radius); }
.pf-filterknopf[aria-expanded="true"], .pf-filterknopf.aktiv { border-color: var(--effekt-aktuell, var(--violet)); }
.pf-filterknopf:hover { border-color: var(--effekt-aktuell, var(--violet));
  background: color-mix(in srgb, var(--effekt-aktuell, var(--violet)) 60%, var(--hover-tiefe)); color: var(--hover-schrift); }
.pf-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 22px; height: 22px; padding: 0 6px;
  font-size: 13px; font-weight: 800; background: var(--effekt-aktuell, var(--violet)); color: var(--auf-farbe); border-radius: var(--radius); }
.pf-badge[hidden] { display: none; }
.pf-chevron { transition: transform .2s var(--ease-out); }
.pf-filterknopf[aria-expanded="true"] .pf-chevron { transform: rotate(180deg); }

.pf-chips { flex: 1 1 100%; min-width: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.pf-chips[hidden] { display: none; }
.pf-chipliste { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.pf-chipliste:empty { display: none; }
.pf-chip { display: inline-flex; align-items: center; min-height: 34px; padding: 0 0 0 10px;
  font-family: var(--font-mono); font-size: 13.5px; font-weight: 700; color: var(--ink);
  border: 1.5px solid var(--effekt, var(--ink-45)); border-radius: var(--radius); }
.pf-chip-weg { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; margin-left: 2px;
  font: inherit; color: inherit; background: transparent; border: 0; cursor: pointer; }
.pf-chip-weg:hover { background: color-mix(in srgb, var(--effekt, var(--effekt-aktuell, var(--violet))) 60%, var(--hover-tiefe)); color: var(--hover-schrift); }
.pf-zuruecksetzen { display: inline-flex; align-items: center; height: 48px; padding: 0 12px; flex: none;
  font-family: var(--font-sans); font-size: 15px; font-weight: 800; color: var(--ink); cursor: pointer;
  background: var(--paper-2); border: 1px solid var(--rand); border-radius: var(--radius); }
.pf-zuruecksetzen:hover { border-color: var(--effekt-aktuell, var(--violet));
  background: color-mix(in srgb, var(--effekt-aktuell, var(--violet)) 60%, var(--hover-tiefe)); color: var(--hover-schrift); }
.pf-zuruecksetzen[hidden] { display: none; }

.pf-rechts { margin-left: auto; display: flex; align-items: center; flex-wrap: wrap; gap: 8px 10px; }
.pf-treffer { font-size: 14px; font-weight: 700; color: var(--ink); white-space: nowrap; font-variant-numeric: tabular-nums; }
.pf-sortierung { font-size: 13px; font-weight: 700; color: var(--ink-70); }
.pf-auswahl { height: 40px; padding: 0 8px; font: inherit; font-size: 14px; font-weight: 700; color: var(--ink);
  background: var(--grund-0); border: 1px solid var(--feld-rand); border-radius: var(--radius); color-scheme: dark; cursor: pointer; }
body.hell .pf-auswahl { color-scheme: light; }
.pf-auswahl:hover { border-color: var(--effekt-aktuell, var(--violet)); }
.pf-auswahl option { background: var(--grund-0); color: var(--ink); font-weight: 600; }

@media (max-width: 767px) {
  .pf-leiste { gap: 10px; }
  .pf-segmente { flex: 1 1 100%; overflow-x: auto; scrollbar-width: none; }
  .pf-segmente::-webkit-scrollbar { display: none; }
  .pf-filterknopf { flex: 1 1 0; min-width: 0; padding: 0 12px; gap: 8px; font-size: 14px; line-height: 1.15; text-align: left; }
  .pf-rechts { display: contents; }
  .pf-auswahl { order: 1; flex: 0 0 auto; }
  .pf-treffer { order: 2; }
  .pf-zuruecksetzen { order: 2; }
  .pf-chips { order: 3; }
  .pf-sortierung { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}

.pf-panel { max-height: 62vh; overflow: auto; overscroll-behavior: contain; margin: 0 0 14px;
  padding: 20px 24px; background: var(--paper-2); border: 1.5px solid var(--ink); border-radius: var(--radius); }
.pf-panel[hidden] { display: none; }
.pf-panelkopf { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px; margin-bottom: 18px; }
.pf-hinweis { margin: 0; max-width: 56ch; font-size: 14px; line-height: 1.5; color: var(--ink-70); }
.pf-hinweis[hidden], .pf-reiterinhalt[hidden] { display: none; }

.pf-spalten { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 44px; }
@media (max-width: 767px) { .pf-spalten { grid-template-columns: minmax(0, 1fr); } }
.pf-spaltentitel { margin: 0 0 6px; font-size: 14px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--ink); }
.pf-regler { display: grid; grid-template-columns: 130px minmax(0, 1fr) 110px; align-items: center; gap: 12px; min-height: 40px; }
@media (max-width: 599px) { .pf-regler { grid-template-columns: 96px minmax(0, 1fr) 86px; gap: 8px; } }
.pf-regler label { font-size: 14px; font-weight: 700; color: var(--effekt-text, var(--ink)); cursor: pointer; }
.pf-regler input[type="range"] { -webkit-appearance: none; appearance: none; width: 100%; height: 28px; margin: 0;
  background: transparent; accent-color: var(--effekt, var(--effekt-aktuell)); cursor: pointer; }
.pf-regler input[type="range"]::-webkit-slider-runnable-track { height: 4px; background: var(--rand); border: 0; }
.pf-regler input[type="range"]::-moz-range-track { height: 4px; background: var(--rand); border: 0; }
.pf-regler input[type="range"]::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 16px; height: 16px;
  margin-top: -6px; background: var(--effekt, var(--effekt-aktuell)); border: 0; border-radius: var(--radius); }
.pf-regler input[type="range"]::-moz-range-thumb { width: 16px; height: 16px; background: var(--effekt, var(--effekt-aktuell));
  border: 0; border-radius: var(--radius); }
.pf-regler input[type="range"]:hover::-webkit-slider-runnable-track { background: var(--ink-45); }
.pf-regler input[type="range"]:hover::-moz-range-track { background: var(--ink-45); }
.pf-stufe { font-family: var(--font-mono); font-size: 13px; font-weight: 600; color: var(--ink-45); text-align: right; }
.pf-stufe.gesetzt { color: var(--effekt-text, var(--ink)); font-weight: 800; }

.pf-technikgruppen { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px 28px; }
@media (max-width: 1023px) { .pf-technikgruppen { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 639px) { .pf-technikgruppen { grid-template-columns: minmax(0, 1fr); } }
.pf-technikkopf { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin: 0 0 8px; }
.pf-technikname { margin: 0; font-size: 15px; font-weight: 800; letter-spacing: -.01em; color: var(--effekt-text, var(--ink)); }
.pf-technikzahl { font-size: 13px; font-weight: 600; color: var(--ink-45); white-space: nowrap; }
.pf-technikzahl.gewaehlt { color: var(--effekt-text, var(--ink)); font-weight: 800; }
.pf-pillen { display: flex; flex-wrap: wrap; gap: 6px; }

.pf-panelfuss { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 12px 18px;
  margin-top: 20px; padding-top: 14px; border-top: 1px solid var(--rule); }
.pf-passend { font-size: 14px; font-weight: 700; color: var(--ink-70); font-variant-numeric: tabular-nums; }
.pf-panelfuss .btn { font-size: 16px; padding: 10px 20px; min-height: 44px; }

.tech-pille { display: inline-flex; align-items: center; min-height: 34px; padding: 6px 13px 5px;
  font-family: var(--font-sans); font-size: 13px; font-weight: 700; letter-spacing: .02em; line-height: 17px; text-align: left;
  color: var(--ink); background: transparent; border: 0; border-radius: 999px; cursor: pointer;
  box-shadow: inset 0 0 0 1.5px var(--effekt, var(--ink-45)); }
.tech-pille[aria-pressed="true"], .tech-pille:has(+ .tech-pop:popover-open) { background: var(--effekt, var(--effekt-aktuell)); color: var(--effekt-auf, var(--auf-farbe)); box-shadow: none; }
.tech-pille:hover { background: color-mix(in srgb, var(--effekt, var(--effekt-aktuell, var(--violet))) 60%, var(--hover-tiefe)); color: var(--hover-schrift); box-shadow: none; }

.pf-bereich .pf-gruppe { margin-top: 56px; }
.pf-bereich .pf-gruppe:first-of-type { margin-top: 30px; }
.pf-gruppe[hidden], .pf-leer[hidden] { display: none; }
.pf-linie { max-width: 88ch; margin: 0 0 22px; }
.pf-linie .lead { margin-top: 0; }
.pf-linie h3 { margin: 14px 0 8px; font-size: 14px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-70); }
.pf-linie ul { margin: 0; padding-left: 18px; font-size: 15px; line-height: 1.55; color: var(--ink-70); }
.pf-linie strong { color: var(--ink); }

.pk-raster { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; margin-top: 10px; }
@media (min-width: 640px) { .pk-raster { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .pk-raster { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

.pf-leer { padding: 44px 0 10px; }
.pf-leer h2 { margin: 0 0 10px; font-size: clamp(24px, 3.2vw, 32px); font-weight: 900; letter-spacing: -.03em; }
.pf-leer-aktion { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 18px; }

.pk-karte { min-width: 0; display: grid; grid-row: span 6; grid-template-rows: subgrid; row-gap: 14px; padding: 22px;
  border: 1.5px solid var(--ink); background: var(--paper-2); box-shadow: 6px 6px 0 var(--effekt-aktuell, var(--violet));
  transition: transform .22s var(--ease-out), box-shadow .22s var(--ease-out); }
.pk-kopf { grid-row: 1; }
.pk-titel { grid-row: 2; }
.pk-textblock { grid-row: 3; display: flex; flex-direction: column; gap: 8px; }
.pk-siegelzeile { grid-row: 4; }
.pk-technik { grid-row: 5; }
.pk-fuss { grid-row: 6; }
@supports not (grid-template-rows: subgrid) {
  .pk-karte { display: flex; flex-direction: column; gap: 14px; }
  .pk-fuss { margin-top: auto; }
}
.pk-karte:nth-child(odd):hover { transform: translate(-2px, -2px) rotate(-.5deg); box-shadow: 8px 8px 0 var(--effekt-aktuell, var(--violet)); }
.pk-karte:nth-child(even):hover { transform: translate(-2px, -2px) rotate(.5deg); box-shadow: 8px 8px 0 var(--effekt-aktuell, var(--violet)); }
.pk-karte[hidden] { display: none; }

.pk-kopf { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; min-height: 26px; }
.pk-typ { font-size: 13px; font-weight: 600; color: var(--ink-70); white-space: nowrap; }
.pk-band { font-size: 13px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; line-height: 17px;
  padding: 3px 8px 2px; color: var(--auf-farbe); background: var(--effekt-aktuell, var(--violet)); }
.pk-passung { margin-left: auto; font-size: 13px; font-weight: 700; line-height: 17px; padding: 3px 10px 2px; white-space: nowrap;
  color: var(--ink); border-radius: 999px; box-shadow: inset 0 0 0 1.5px var(--effekt-aktuell, var(--violet)); }
.pk-passung[hidden] { display: none; }

.pk-titel { margin: 0; font-size: 19px; font-weight: 900; letter-spacing: -.02em; line-height: 1.2; overflow-wrap: break-word; }
.pk-titel a { color: inherit; text-decoration: none; }
.pk-titel a:hover, .pk-titel a:focus-visible { color: var(--effekt-text, var(--violet)); text-decoration: underline; text-underline-offset: 3px; }
.pk-text { margin: 0; font-size: 14px; line-height: 1.5; color: var(--ink-70); min-height: calc(4 * 1.5em);
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; line-clamp: 4; overflow: hidden; }
.pk-karte .kat-hinweis { margin: 0; }

.pk-siegelzeile { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 12px 18px; padding: 12px 0 0 15px; border-top: 1px solid var(--rule); }
.pk-siegelzeile .hexsiegel { flex: none; }
.pk-siegelzeile .hexsiegel-werte { flex: 1 1 143px; min-width: 0; }

.pk-technik { position: relative; list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; align-content: flex-start; gap: 6px; }
.pk-tech { font-size: 13px; font-weight: 700; line-height: 17px; padding: 4px 10px 3px; color: var(--ink-70);
  border-radius: 999px; box-shadow: inset 0 0 0 1.5px var(--rand); }
.pk-tech.an { background: var(--effekt, var(--effekt-aktuell)); color: var(--effekt-auf, var(--auf-farbe)); box-shadow: none; }
.pk-tech-mehr { color: var(--ink-45); }
.pk-tech-mehr[hidden] { display: none; }
.pk-tech-ueber { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.pk-fuss { container-type: inline-size; align-self: start; padding-top: 14px; border-top: 1px solid var(--rule); }
.pk-fussraster { --pk-knopf: 134px; display: grid; grid-template-columns: minmax(0, 1fr) var(--pk-knopf); align-items: center; gap: 2px 16px;
  grid-template-areas: "label knopf" "betrag knopf" "unter plan"; }
.pk-preis, .pk-aktion { display: contents; }
.pk-preislabel { grid-area: label; align-self: start; }
.pk-betrag { grid-area: betrag; }
.pk-unterzeile { grid-area: unter; }
.pk-aktion > .korb-form, .pk-aktion > .btn { grid-area: knopf; align-self: start; }
.pk-plan { grid-area: plan; justify-self: end; }
.pk-preislabel { font-size: 13px; font-weight: 600; color: var(--ink-70); white-space: nowrap; text-box: trim-start cap alphabetic; }
.pk-betrag { display: flex; flex-wrap: nowrap; align-items: baseline; gap: 2px 10px; font-size: 23px; font-weight: 800; letter-spacing: -.01em;
  line-height: 1.2; white-space: nowrap; color: var(--effekt-text, var(--ink)); font-variant-numeric: tabular-nums; }
.pk-streich { font-size: 15px; font-weight: 600; color: var(--ink-45); text-decoration-thickness: 2px; }
.pk-unterzeile { font-size: 13px; line-height: 1.4; color: var(--ink-70); white-space: nowrap; }
.pk-aktion .korb-form { display: flex; margin: 0; }
.pk-aktion .btn { width: 100%; min-height: 44px; justify-content: center; padding: 10px 18px; font-size: 16px; white-space: nowrap; }
.pk-aktion .pk-imkorb { padding: 8px; font-size: 14px; }
@container (width < 339px) {
  .pk-fussraster { grid-template-columns: var(--pk-knopf) minmax(0, 1fr);
    grid-template-areas: "label label" "betrag betrag" "unter unter" "knopf plan"; }
  .pk-aktion > .korb-form, .pk-aktion > .btn, .pk-plan { margin-top: 12px; }
}
@container (width < 280px) {
  .pk-fussraster { grid-template-columns: minmax(0, 1fr); grid-template-areas: "label" "betrag" "unter" "knopf" "plan"; }
  .pk-plan { justify-self: center; margin-top: 4px; }
}
.pk-plan { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 6px;
  font-family: var(--font-mono); font-size: 14px; font-weight: 700; color: var(--ink); text-decoration: none; white-space: nowrap; }
.pk-plan:hover, .pk-plan:focus-visible { color: var(--effekt-text, var(--violet)); text-decoration: underline; text-underline-offset: 3px; }

@media (prefers-reduced-motion: reduce) {
  .pk-karte { transition: none; }
  .pk-karte:hover { transform: none; }
  .pf-chevron { transition: none; }
}

.hexsiegel-werte { display: grid; perspective: 600px; }
.hexsiegel-werteseite { grid-area: 1 / 1; backface-visibility: hidden; transform-style: preserve-3d;
  transition: transform .4s cubic-bezier(.4, 0, .2, 1); }
.hexsiegel-werteseite-hinten { transform: rotateY(180deg); }
body.siegel-technik .hexsiegel-werteseite-vorn { transform: rotateY(-180deg); }
body.siegel-technik .hexsiegel-werteseite-hinten { transform: rotateY(0deg); }
.hexsiegel-tabelle { border-collapse: collapse; font-size: 13px; line-height: 1.45; }
.hexsiegel-tabelle .hexsiegel-zeile { display: table-row; }
.hexsiegel-tabelle td, .hexsiegel-tabelle th { padding: 2px 0; vertical-align: middle; }
.hexsiegel-tabelle td { transition: opacity .2s; }
.hexsiegel-tabelle .hexsiegel-wert { padding-right: 10px; }
.hexsiegel-tabelle .hexsiegel-ikonenzelle { width: 18px; padding-right: 10px; }
.hexsiegel-ikonenzelle .hexsiegel-ikone { display: block; }
.hexsiegel-tabelle .hexsiegel-name { text-align: left; font-weight: 600; }

.pf-bereich[data-gewichtet] .hexsiegel-tabelle .hexsiegel-zeile td { opacity: .4; }
.pf-bereich[data-gewichtet~="kunde"] .hexsiegel-tabelle .hexsiegel-zeile[data-k="kunde"] td,
.pf-bereich[data-gewichtet~="produkt"] .hexsiegel-tabelle .hexsiegel-zeile[data-k="produkt"] td,
.pf-bereich[data-gewichtet~="ablaeufe"] .hexsiegel-tabelle .hexsiegel-zeile[data-k="ablaeufe"] td,
.pf-bereich[data-gewichtet~="vertrieb"] .hexsiegel-tabelle .hexsiegel-zeile[data-k="vertrieb"] td,
.pf-bereich[data-gewichtet~="mitarbeiter"] .hexsiegel-tabelle .hexsiegel-zeile[data-k="mitarbeiter"] td,
.pf-bereich[data-gewichtet~="service"] .hexsiegel-tabelle .hexsiegel-zeile[data-k="service"] td,
.pf-bereich[data-gewichtet~="ki"] .hexsiegel-tabelle .hexsiegel-zeile[data-k="ki"] td,
.pf-bereich[data-gewichtet~="echtzeit"] .hexsiegel-tabelle .hexsiegel-zeile[data-k="echtzeit"] td,
.pf-bereich[data-gewichtet~="schnittstellen"] .hexsiegel-tabelle .hexsiegel-zeile[data-k="schnittstellen"] td,
.pf-bereich[data-gewichtet~="datenmenge"] .hexsiegel-tabelle .hexsiegel-zeile[data-k="datenmenge"] td,
.pf-bereich[data-gewichtet~="mobil"] .hexsiegel-tabelle .hexsiegel-zeile[data-k="mobil"] td,
.pf-bereich[data-gewichtet~="cloud"] .hexsiegel-tabelle .hexsiegel-zeile[data-k="cloud"] td { opacity: 1; }

@media (prefers-reduced-motion: reduce) {
  .hexsiegel-flaeche, .hexsiegel-werteseite { transform: none !important; transition: opacity .4s linear; }
  .hexsiegel-hinten, .hexsiegel-werteseite-hinten { opacity: 0; }
  body.siegel-technik .hexsiegel-vorn, body.siegel-technik .hexsiegel-werteseite-vorn { opacity: 0; }
  body.siegel-technik .hexsiegel-hinten, body.siegel-technik .hexsiegel-werteseite-hinten { opacity: 1; }
}

.tech-gruppen { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 30px 34px; margin-top: 18px; }
@media (max-width: 1023px) { .tech-gruppen { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 639px) { .tech-gruppen { grid-template-columns: minmax(0, 1fr); } }
.tech-gruppenkopf { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin: 0 0 12px; }
.tech-gruppenkopf .universum-gruppe-titel { margin: 0; flex-wrap: nowrap; min-width: 0; }
.tech-gruppenkopf .pf-technikzahl { flex: none; }
.tech-liste { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.tech-pop { width: min(380px, calc(100vw - 32px)); padding: 16px 18px 18px; margin: auto;
  color: var(--ink); background: var(--paper-2); border: 1.5px solid var(--ink); border-radius: var(--radius);
  box-shadow: 6px 6px 0 var(--effekt, var(--effekt-aktuell)); }
.tech-pop::backdrop { background: transparent; }
.tech-pop-kopf { display: flex; align-items: center; gap: 8px; margin: 0 0 8px; font-size: 13px; font-weight: 700; color: var(--effekt-text, var(--ink-70)); }
.tech-pop-name { margin: 0 0 6px; font-size: 18px; font-weight: 800; letter-spacing: -.01em; }
.tech-pop-stich { margin: 0 0 14px; font-size: 14px; line-height: 1.5; color: var(--ink-70); }
.tech-pop-zeigen { width: 100%; min-height: 44px; text-align: center; }

@media print {
  .pf-filter, .pk-aktion, .pk-passung, .tech-pop { display: none !important; }
  .pk-karte { box-shadow: none !important; border: 1px solid var(--rand) !important; background: var(--paper) !important; break-inside: avoid; }
  .pk-text { display: block; -webkit-line-clamp: unset; line-clamp: none; overflow: visible; }
  .hexsiegel-werteseite { transform: none !important; opacity: 1 !important; }
  .hexsiegel-werteseite-hinten { display: none !important; }
  .pf-bereich[data-gewichtet] .hexsiegel-tabelle .hexsiegel-zeile td { opacity: 1 !important; }
}