/* Wizard: Steuer-Check — Font Awesome + cheerful UX */
/* Inline Font Awesome SVG icons */
.sc-ico {
  width: 1.15em;
  height: 1.15em;
  display: inline-block;
  vertical-align: -0.15em;
  fill: currentColor;
  flex: none;
}
.sc-step-icon .sc-ico { width: 1.25em; height: 1.25em; }
.sc-card-icon .sc-ico,
.sc-cost-icon .sc-ico:not(.sc-cost-check) { width: 1.2em; height: 1.2em; }
.sc-dot .n .sc-ico { width: 0.95em; height: 0.95em; }
.sc-fa-float .sc-ico { width: 1.2em; height: 1.2em; }
.sc-result-fa-main .sc-ico { width: 2rem; height: 2rem; }
.sc-result-fa-orbit .sc-ico { width: 0.95em; height: 0.95em; }
.sc-subhead .sc-ico { width: 0.85em; height: 0.85em; }
.sc-btn .sc-ico { width: 0.95em; height: 0.95em; }
.sc-tip-icon .sc-ico { width: 1em; height: 1em; }
.sc-meter-head .sc-ico { width: 0.95em; height: 0.95em; margin-right: 4px; }
.sc-cost-check {
  position: absolute;
  right: -4px;
  bottom: -4px;
  width: 16px !important;
  height: 16px !important;
  padding: 3px;
  box-sizing: content-box;
  border-radius: 50%;
  background: var(--ok);
  color: #fff !important;
  display: none;
  border: 2px solid var(--surface);
}
.sc-cost.is-selected .sc-cost-check { display: block; }

.sc-page {
  max-width: 820px;
  margin: 0 auto;
}
.sc-page .lang-switch button {
  transition: background .15s ease, color .15s ease, opacity .15s ease;
}
.sc-page .lang-switch button:hover:not([aria-pressed="true"]) {
  background: color-mix(in srgb, var(--accent) 10%, transparent);
  color: var(--ink);
}
.sc-hero {
  position: relative;
  overflow: hidden;
  border-radius: 20px;
  padding: 28px 28px 24px;
  margin-bottom: 18px;
  background:
    radial-gradient(520px 240px at 0% 0%, color-mix(in srgb, var(--cheer-peach) 45%, transparent), transparent 70%),
    radial-gradient(480px 220px at 100% 10%, color-mix(in srgb, var(--accent) 18%, transparent), transparent 65%),
    var(--surface);
  border: 1px solid var(--border);
  box-shadow: 0 10px 40px color-mix(in srgb, var(--accent) 8%, transparent);
}
.sc-hero-art {
  position: absolute;
  right: 16px;
  top: 16px;
  width: min(190px, 40%);
  height: 110px;
  pointer-events: none;
}
.sc-fa-float {
  position: absolute;
  display: grid;
  place-items: center;
  border-radius: 14px;
}
.sc-fa-float i { font-size: 1.15rem; }
.sc-fa-float--doc {
  left: 12px; top: 30px;
  width: 48px; height: 48px;
  background: var(--accent-soft);
  color: var(--accent);
  border: 1px solid color-mix(in srgb, var(--accent) 22%, transparent);
}
.sc-fa-float--coins {
  right: 22px; top: 16px;
  width: 44px; height: 44px;
  background: #FFF7ED;
  color: #C2410C;
  border: 1px solid #FED7AA;
}
.sc-fa-float--check {
  right: 8px; bottom: 12px;
  width: 40px; height: 40px;
  background: #EFF6FF;
  color: var(--accent);
  border: 1px solid #BFDBFE;
}
.sc-fa-float--spark {
  left: 68px; top: 8px;
  width: 32px; height: 32px;
  background: #FFF1F2;
  color: #BE123C;
  border: 1px solid #FECDD3;
  font-size: .85rem;
}
.sc-hero-coin {
  animation: sc-coin-bob 2.4s ease-in-out infinite;
}
.sc-hero-coin--2 { animation-delay: .35s; }
.sc-hero-coin--3 { animation-delay: .7s; }
@keyframes sc-coin-bob {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-6px); }
}
@media (max-width: 640px) {
  .sc-hero { padding: 22px 18px 18px; }
  .sc-hero-art { display: none; }
}
.sc-hero h1 {
  margin: 0 0 8px;
  font-size: clamp(1.45rem, 3.2vw, 1.9rem);
  line-height: 1.2;
  letter-spacing: -0.02em;
  max-width: 18ch;
}
.sc-hero-lead {
  margin: 0;
  max-width: 46ch;
  color: var(--ink-2);
  font-size: 1rem;
  line-height: 1.5;
}
.sc-progress {
  display: flex;
  gap: 10px;
  margin-top: 22px;
  flex-wrap: wrap;
}
.sc-dot {
  appearance: none;
  border: 0;
  background: transparent;
  padding: 0;
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--ink-muted);
  font-size: 12.5px;
  font-weight: 600;
  cursor: default;
}
.sc-dot .n {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  border: 1.5px solid var(--border);
  background: var(--page);
  color: var(--ink-2);
  font-size: 0.85rem;
  transition: background .2s ease, border-color .2s ease, color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.sc-dot.is-active .n {
  background: var(--accent);
  border-color: var(--accent);
  color: var(--accent-ink);
  transform: scale(1.08);
  box-shadow: 0 6px 16px color-mix(in srgb, var(--accent) 35%, transparent);
}
.sc-dot.is-done .n {
  background: color-mix(in srgb, var(--ok) 18%, var(--surface));
  border-color: color-mix(in srgb, var(--ok) 45%, transparent);
  color: var(--ok);
}
.sc-dot-label { display: none; }
@media (min-width: 640px) {
  .sc-dot-label { display: inline; }
}

.sc-panel {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 20px;
  padding: 24px 26px 22px;
  box-shadow: 0 8px 28px color-mix(in srgb, var(--accent) 6%, transparent);
  animation: sc-in .35s ease both;
}
@keyframes sc-in {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: none; }
}

.sc-step-icon {
  width: 48px;
  height: 48px;
  margin: 0 0 12px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  font-size: 1.2rem;
  animation: sc-icon-in .4s ease both;
  border: 1px solid var(--border);
}
.sc-step-icon--status { background: var(--accent-soft); color: var(--accent); }
.sc-step-icon--income { background: #FFF7ED; color: #C2410C; border-color: #FED7AA; }
.sc-step-icon--costs { background: #EFF6FF; color: var(--accent); border-color: #BFDBFE; }
@keyframes sc-icon-in {
  from { opacity: 0; transform: scale(.86) translateY(6px); }
  to { opacity: 1; transform: none; }
}
.sc-step h2 {
  margin: 0 0 6px;
  font-size: 1.25rem;
  letter-spacing: -0.01em;
}
.sc-step-lead {
  margin: 0 0 18px;
  color: var(--ink-2);
  font-size: 0.95rem;
  line-height: 1.45;
}
.sc-step-lead--tight { margin-bottom: 12px; font-size: 0.88rem; }

.sc-cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
@media (max-width: 720px) {
  .sc-cards { grid-template-columns: 1fr; }
}
.sc-card {
  appearance: none;
  text-align: left;
  cursor: pointer;
  border: 1.5px solid var(--border);
  background: var(--page);
  border-radius: 16px;
  padding: 16px 14px 14px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease, background .15s ease;
  color: inherit;
  font: inherit;
}
.sc-card:hover {
  border-color: color-mix(in srgb, var(--accent) 45%, var(--border));
  transform: translateY(-3px);
}
.sc-card:active { transform: translateY(-1px) scale(.99); }
.sc-card.is-selected {
  border-color: var(--accent);
  background: var(--accent-soft);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 18%, transparent);
}
.sc-card-icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  font-size: 1.15rem;
  transition: transform .2s ease;
  border: 1px solid transparent;
}
.sc-card:hover .sc-card-icon { transform: translateY(-1px); }
.sc-card-icon--single { background: var(--accent-soft); color: var(--accent); border-color: #BFDBFE; }
.sc-card-icon--parent { background: #FFF7ED; color: #C2410C; border-color: #FED7AA; }
.sc-card-icon--married { background: #FFF1F2; color: #BE123C; border-color: #FECDD3; }
.sc-card strong {
  font-size: 0.98rem;
  line-height: 1.25;
}
.sc-card span {
  font-size: 0.82rem;
  color: var(--ink-2);
  line-height: 1.4;
}

.sc-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 12px 14px;
}
@media (max-width: 560px) {
  .sc-grid { grid-template-columns: 1fr; }
}
.sc-grid .field-wide { grid-column: 1 / -1; }
.sc-check {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  padding-top: 6px;
}
.sc-check input { margin-top: 3px; accent-color: var(--accent); width: 18px; height: 18px; }
.sc-combo {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
@media (max-width: 560px) {
  .sc-combo { grid-template-columns: 1fr; }
}
.sc-combo label {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 12px 14px;
  border: 1.5px solid var(--border);
  border-radius: 14px;
  background: var(--page);
  cursor: pointer;
  transition: border-color .15s ease, transform .15s ease;
}
.sc-combo label:hover {
  border-color: color-mix(in srgb, var(--accent) 40%, var(--border));
  transform: translateY(-1px);
}
.sc-combo input { margin-top: 3px; accent-color: var(--accent); }
.sc-combo strong { display: block; font-size: 0.92rem; }
.sc-combo small { display: block; color: var(--ink-2); font-size: 0.8rem; margin-top: 2px; line-height: 1.35; }

.sc-nav {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  margin-top: 18px;
  flex-wrap: wrap;
  align-items: center;
}
.sc-btn {
  appearance: none;
  border: 1.5px solid var(--border);
  background: var(--surface);
  color: var(--ink);
  font: inherit;
  font-weight: 600;
  font-size: 0.95rem;
  padding: 11px 18px;
  border-radius: 999px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: background .15s ease, border-color .15s ease, color .15s ease, transform .15s ease, box-shadow .15s ease;
}
.sc-btn:hover { border-color: var(--ink-muted); }
.sc-btn:active { transform: scale(.98); }
.sc-btn-primary {
  background: var(--accent);
  border-color: var(--accent);
  color: var(--accent-ink);
  box-shadow: 0 8px 18px color-mix(in srgb, var(--accent) 28%, transparent);
}
.sc-btn-primary:hover {
  filter: brightness(1.05);
  transform: translateY(-1px);
}
.sc-btn-ghost { background: transparent; }

.sc-result {
  text-align: center;
  padding: 8px 4px 4px;
}
.sc-result-visual {
  margin: 0 auto 10px;
  width: 160px;
  height: 110px;
  position: relative;
  animation: sc-icon-in .4s ease both;
}
.sc-result-fa {
  width: 100%;
  height: 100%;
  position: relative;
  display: grid;
  place-items: center;
}
.sc-result-fa-main {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 2rem;
  border: 1px solid var(--border);
}
.sc-result-fa--refund .sc-result-fa-main {
  background: #EFF6FF;
  color: var(--accent);
  border-color: #BFDBFE;
}
.sc-result-fa--owe .sc-result-fa-main {
  background: #FFF7ED;
  color: #C2410C;
  border-color: #FED7AA;
}
.sc-result-fa--even .sc-result-fa-main {
  background: var(--accent-soft);
  color: var(--accent);
}
.sc-result-fa-orbit {
  position: absolute;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  background: #FFF7ED;
  color: #C2410C;
  font-size: 0.9rem;
  border: 1px solid #FED7AA;
}
.sc-result-fa-orbit { left: 12px; top: 12px; }
.sc-result-fa-orbit--2 { left: auto; right: 10px; top: 8px; background: #FFF1F2; color: #BE123C; border-color: #FECDD3; }
.sc-result-fa-orbit--3 { left: auto; right: 20px; bottom: 8px; top: auto; background: var(--accent-soft); color: var(--accent); border-color: #BFDBFE; }
.sc-result[data-tone="refund"] .sc-result-visual {
  animation: sc-icon-in .4s ease both, sc-celebrate .7s ease .15s both;
}
@keyframes sc-celebrate {
  0% { transform: scale(.9); }
  50% { transform: scale(1.06); }
  100% { transform: scale(1); }
}
.sc-result-kicker {
  margin: 0;
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--ink-muted);
}
.sc-result-amount {
  margin: 4px 0 8px;
  font-size: clamp(2.4rem, 6vw, 3.4rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.05;
}
.sc-result[data-tone="refund"] .sc-result-amount { color: var(--ok); }
.sc-result[data-tone="owe"] .sc-result-amount { color: var(--warn); }
.sc-result-lead {
  margin: 0 auto 18px;
  max-width: 42ch;
  color: var(--ink-2);
  font-size: 1rem;
  line-height: 1.45;
}
.sc-result-facts {
  list-style: none;
  margin: 0 auto 16px;
  padding: 0;
  max-width: 420px;
  text-align: left;
  border: 1px solid var(--border);
  border-radius: 14px;
  overflow: hidden;
  background: var(--page);
}
.sc-result-facts li {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 14px;
  font-size: 0.9rem;
  border-bottom: 1px solid var(--hairline);
  color: var(--ink-2);
}
.sc-result-facts li:last-child { border-bottom: 0; }
.sc-result-facts strong { color: var(--ink); font-variant-numeric: tabular-nums; }
.sc-result-note {
  margin: 0 auto 14px;
  max-width: 52ch;
  font-size: 0.82rem;
  color: var(--ink-muted);
  line-height: 1.45;
}
.sc-result-links {
  margin: 0;
  font-size: 0.9rem;
}
.sc-result-links .sep { color: var(--ink-muted); margin: 0 4px; }
.sc-result-parts-title {
  margin: 0 auto 8px;
  max-width: 420px;
  text-align: left;
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--ink-muted);
  letter-spacing: 0.03em;
  text-transform: uppercase;
}
.sc-result-parts { margin-bottom: 16px; }

.sc-disclaimer {
  margin: 16px 0 0;
  padding: 12px 14px;
  border-radius: 12px;
  background: color-mix(in srgb, var(--warn) 10%, transparent);
  border: 1px solid color-mix(in srgb, var(--warn) 28%, transparent);
  color: var(--ink-2);
  font-size: 0.85rem;
  line-height: 1.45;
}
.sc-seo {
  margin-top: 28px;
  color: var(--ink-2);
  font-size: 0.92rem;
  line-height: 1.5;
}
.sc-seo h2 { font-size: 1.1rem; color: var(--ink); margin: 18px 0 8px; }
.sc-seo h2:first-of-type { margin-top: 0; }
.sc-seo ul {
  margin: 0 0 12px;
  padding-left: 1.15em;
}
.sc-seo li { margin-bottom: 6px; }
.sc-seo details {
  border-top: 1px solid var(--hairline);
  padding: 10px 0;
}
.sc-seo details:first-of-type { border-top: 0; }
.sc-seo summary {
  cursor: pointer;
  font-weight: 600;
  color: var(--ink);
}
.sc-seo details p { margin: 8px 0 0; }

.sc-subhead {
  margin: 22px 0 8px;
  font-size: 0.98rem;
  letter-spacing: -0.01em;
  color: var(--ink);
  display: flex;
  align-items: center;
  gap: 8px;
}
.sc-subhead > i {
  width: 28px;
  height: 28px;
  border-radius: 9px;
  display: grid;
  place-items: center;
  font-size: 0.8rem;
  background: color-mix(in srgb, var(--accent) 14%, transparent);
  color: var(--accent);
  flex: none;
}

.sc-meter {
  margin: 0 0 18px;
  padding: 14px 16px;
  border-radius: 16px;
  border: 1px solid var(--border);
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--accent) 8%, transparent), transparent 55%),
    var(--page);
  transition: border-color .2s ease, background .2s ease;
}
.sc-meter[data-state="near"] {
  border-color: color-mix(in srgb, var(--cheer-orange) 40%, var(--border));
}
.sc-meter[data-state="over"] {
  border-color: color-mix(in srgb, var(--ok) 45%, var(--border));
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--ok) 12%, transparent), transparent 55%),
    var(--page);
}
.sc-meter-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: baseline;
  flex-wrap: wrap;
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--ink-2);
  margin-bottom: 10px;
}
.sc-meter-head i { color: var(--accent); margin-right: 4px; }
.sc-meter-head strong {
  color: var(--ink);
  font-variant-numeric: tabular-nums;
  font-size: 0.92rem;
}
.sc-meter-track {
  position: relative;
  height: 12px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--ink) 8%, transparent);
  overflow: hidden;
}
.sc-meter-fill {
  height: 100%;
  width: 0;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--accent), color-mix(in srgb, var(--cheer-orange) 70%, var(--accent)));
  transition: width .35s cubic-bezier(.22, 1, .36, 1);
}
.sc-meter[data-state="over"] .sc-meter-fill {
  background: linear-gradient(90deg, var(--accent), var(--ok));
}
.sc-meter-mark {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 62.5%;
  width: 2px;
  background: color-mix(in srgb, var(--ink) 35%, transparent);
}
.sc-meter-hint {
  margin: 10px 0 0;
  font-size: 0.82rem;
  color: var(--ink-2);
  line-height: 1.4;
}

.sc-cost-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
@media (max-width: 720px) {
  .sc-cost-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 420px) {
  .sc-cost-grid { grid-template-columns: 1fr; }
}
.sc-cost {
  appearance: none;
  text-align: left;
  cursor: pointer;
  border: 1.5px solid var(--border);
  background: var(--page);
  border-radius: 14px;
  padding: 14px 12px 12px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  color: inherit;
  font: inherit;
  position: relative;
  transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease, background .15s ease;
  animation: sc-in .4s ease both;
}
.sc-cost:nth-child(1) { animation-delay: .02s; }
.sc-cost:nth-child(2) { animation-delay: .05s; }
.sc-cost:nth-child(3) { animation-delay: .08s; }
.sc-cost:nth-child(4) { animation-delay: .11s; }
.sc-cost:nth-child(5) { animation-delay: .14s; }
.sc-cost:nth-child(6) { animation-delay: .17s; }
.sc-cost:hover {
  border-color: color-mix(in srgb, var(--accent) 40%, var(--border));
  transform: translateY(-3px);
  box-shadow: 0 10px 22px color-mix(in srgb, var(--accent) 12%, transparent);
}
.sc-cost:active { transform: translateY(-1px) scale(.98); }
.sc-cost.is-selected {
  border-color: var(--accent);
  background: var(--accent-soft);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 16%, transparent);
}
.sc-cost-icon {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  margin-bottom: 6px;
  font-size: 1.1rem;
  position: relative;
  transition: transform .2s ease;
  border: 1px solid transparent;
}
.sc-cost:hover .sc-cost-icon { transform: translateY(-1px); }
.sc-cost.is-selected .sc-cost-icon { transform: none; }
.sc-cost-icon--clothing { background: #FFF1F2; color: #BE123C; border-color: #FECDD3; }
.sc-cost-icon--tools { background: var(--accent-soft); color: var(--accent); border-color: #BFDBFE; }
.sc-cost-icon--training { background: #FFF7ED; color: #C2410C; border-color: #FED7AA; }
.sc-cost-icon--phone { background: #ECFEFF; color: #0E7490; border-color: #A5F3FC; }
.sc-cost-icon--move { background: #FFF7ED; color: #EA580C; border-color: #FED7AA; }
.sc-cost-icon--union { background: #F5F3FF; color: #6D28D9; border-color: #DDD6FE; }
.sc-cost strong {
  font-size: 0.88rem;
  line-height: 1.25;
}
.sc-cost > span:last-child {
  font-size: 0.75rem;
  color: var(--ink-2);
  line-height: 1.35;
}

.sc-tip {
  margin-top: 12px;
  padding: 14px 16px 14px 60px;
  position: relative;
  border-radius: 14px;
  border: 1px solid color-mix(in srgb, var(--cheer-orange) 28%, var(--border));
  background:
    radial-gradient(280px 120px at 0% 0%, color-mix(in srgb, var(--cheer-peach) 35%, transparent), transparent 70%),
    var(--surface);
}
.sc-tip-icon {
  position: absolute;
  left: 12px;
  top: 14px;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  background: #FFF7ED;
  color: #C2410C;
  font-size: 0.95rem;
  border: 1px solid #FED7AA;
}
.sc-tip--pulse { animation: sc-tip-in .35s ease both; }
@keyframes sc-tip-in {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: none; }
}
.sc-tip-kicker {
  margin: 0 0 4px;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--cheer-orange);
}
.sc-tip-title {
  margin: 0 0 6px;
  font-size: 1rem;
  font-weight: 700;
  color: var(--ink);
}
.sc-tip-body {
  margin: 0;
  font-size: 0.9rem;
  color: var(--ink-2);
  line-height: 1.55;
}
.sc-cost-amounts {
  margin-top: 14px;
  padding-top: 4px;
  animation: sc-in .3s ease both;
}

@media (prefers-reduced-motion: reduce) {
  .sc-panel,
  .sc-step-icon,
  .sc-result-visual,
  .sc-tip--pulse,
  .sc-cost-amounts,
  .sc-meter-fill,
  .sc-cost,
  .sc-card,
  .sc-btn,
  .sc-hero-coin {
    animation: none !important;
    transition: none !important;
  }
}