/* ============================================================
   ParusVoice — /business/ Redesign (Owner 2026-07-12)
   Fünf Bühnen statt Karten-Monotonie: editorialer Hero mit
   Angebots-Vignette · Zusagen-Checkliste · Ablauf-Band ·
   dunkle Compliance-Bühne · Formular. Nutzt tokens.v2.css.
   ============================================================ */

/* 1 · Hero: zweispaltig, rechts die dunkle Angebots-Vignette */
.biz-hero { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(300px, .8fr); gap: clamp(28px, 5vw, 64px); align-items: center; }
.biz-offer { background: var(--pv-dark); border-radius: var(--pv-r-card); padding: 26px 26px 22px; color: var(--pv-on-dark); box-shadow: var(--pv-shadow-window); transform: rotate(.4deg); }
.biz-offer__head { display: flex; justify-content: space-between; align-items: baseline; border-bottom: 1px solid rgba(251,250,246,.14); padding-bottom: 14px; margin-bottom: 14px; }
.biz-offer__title { font-weight: 700; font-size: 15.5px; color: var(--pv-on-dark); }
.biz-offer__tag { font-family: var(--pv-mono); font-size: 10.5px; letter-spacing: .12em; color: var(--pv-accent); text-transform: uppercase; }
.biz-offer ul { list-style: none; margin: 0; padding: 0; }
.biz-offer li { display: flex; gap: 10px; align-items: baseline; padding: 7.5px 0; font-size: 14px; color: rgba(251,250,246,.86); }
.biz-offer li::before { content: '✓'; color: var(--pv-accent); font-weight: 700; font-size: 13px; }
.biz-offer__foot { margin-top: 14px; padding-top: 12px; border-top: 1px solid rgba(251,250,246,.14); font-family: var(--pv-mono); font-size: 11px; letter-spacing: .08em; color: rgba(251,250,246,.55); text-transform: uppercase; }

/* 2 · Zusagen: sticky These links, Checklisten-Zeilen rechts */
.biz-promise { border-top: 1px solid var(--pv-hairline); padding: clamp(56px, 7vw, 84px) 0; }
.biz-promise__grid { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: clamp(28px, 5vw, 72px); align-items: start; }
.biz-promise__lead { position: sticky; top: 32px; }
.biz-promise__lead h2 { margin: 16px 0 14px; }
.biz-promise__lead p { max-width: 44ch; margin: 0; color: var(--pv-text); }
.biz-plist { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--pv-hairline); }
.biz-plist li { display: grid; grid-template-columns: 26px minmax(0,1fr); gap: 14px; padding: 17px 0 16px; border-bottom: 1px solid var(--pv-hairline); }
.biz-plist .biz-tick { width: 22px; height: 22px; border-radius: var(--pv-r-pill); background: var(--pv-banner); color: var(--pv-accent-dark); display: grid; place-items: center; font-size: 12px; font-weight: 800; margin-top: 2px; }
.biz-plist b { display: block; color: var(--pv-ink); font-size: 16px; margin-bottom: 2px; font-weight: 650; }
.biz-plist p { margin: 0; font-size: 14.5px; color: var(--pv-text-2); max-width: 62ch; }

/* 3 · Ablauf: schmales Mono-Nummern-Band auf Banner-Tint */
.biz-steps { background: var(--pv-banner); border-block: 1px solid var(--pv-hairline); padding: clamp(40px, 5vw, 58px) 0; }
.biz-steps__head { display: flex; align-items: baseline; justify-content: space-between; gap: 20px; margin-bottom: 26px; flex-wrap: wrap; }
.biz-steps__note { font-family: var(--pv-mono); font-size: 11.5px; letter-spacing: .08em; color: var(--pv-muted); text-transform: uppercase; }
.biz-steps__row { display: grid; grid-template-columns: repeat(4, 1fr); }
.biz-step { padding: 4px 22px 0 0; margin-right: 22px; border-right: 1px solid var(--pv-border); }
.biz-step:last-child { border-right: 0; margin-right: 0; padding-right: 0; }
.biz-step__n { font-family: var(--pv-mono); font-size: 12px; color: var(--pv-accent-dark); letter-spacing: .1em; }
.biz-step b { display: block; color: var(--pv-ink); font-size: 15.5px; margin: 6px 0 4px; font-weight: 650; }
.biz-step p { margin: 0; font-size: 13.5px; color: var(--pv-text-2); }

/* 4 · Compliance: dunkle Bühne mit hairline-geteiltem 2×2-Raster */
.biz-dark { background: var(--pv-dark); color: var(--pv-on-dark); padding: clamp(56px, 7vw, 84px) 0; }
.biz-dark .sec-eyebrow { color: rgba(251,250,246,.5); }
.biz-dark h2 { color: var(--pv-on-dark); margin: 16px 0 8px; }
.biz-dark__sub { color: rgba(251,250,246,.62); max-width: 62ch; margin: 0 0 34px; }
.biz-dgrid { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid rgba(251,250,246,.14); }
.biz-dcell { padding: 22px 28px 22px 0; border-bottom: 1px solid rgba(251,250,246,.14); }
.biz-dcell:nth-child(odd) { border-right: 1px solid rgba(251,250,246,.14); }
.biz-dcell:nth-child(even) { padding-left: 28px; padding-right: 0; }
.biz-dcell b { display: block; color: var(--pv-on-dark); font-size: 16px; margin-bottom: 4px; font-weight: 650; }
.biz-dcell p { margin: 0; font-size: 14px; color: rgba(251,250,246,.66); max-width: 52ch; }
.biz-dark__meta { margin-top: 26px; font-family: var(--pv-mono); font-size: 11.5px; letter-spacing: .12em; text-transform: uppercase; color: rgba(251,250,246,.45); }
.biz-dark__meta a { color: rgba(251,250,246,.7); }

@media (max-width: 880px) {
  .biz-hero { grid-template-columns: 1fr; }
  .biz-offer { transform: none; }
  .biz-promise__grid { grid-template-columns: 1fr; }
  .biz-promise__lead { position: static; }
  .biz-steps__row { grid-template-columns: 1fr 1fr; row-gap: 22px; }
  .biz-step:nth-child(2) { border-right: 0; }
  .biz-dgrid { grid-template-columns: 1fr; }
  .biz-dcell:nth-child(odd) { border-right: 0; }
  .biz-dcell:nth-child(even) { padding-left: 0; }
}
