/* Business-esittelysivu (yrityksille.html) Edustajatutka Businessin ilmeellä: erittäin tumma pohja, violetti ja pinkki.
   Koskee vain tätä sivua (html.bz-intro). Sivuston yläpalkki ja alatunniste pysyvät sivuston omina. */
html.bz-intro {
  --paper: #050509; --surface: #0b0b12; --ink: #f4f4f7; --ink-2: #a1a1aa; --ink-3: #8b8b96; --line: #242433; --line-2: #33334a;
  --bz-card: #101018; --bz-violet: #8b5cf6; --bz-violet-strong: #7c3aed; --bz-pink: #d946ef; --bz-violet-soft: rgba(139, 92, 246, .14);
  --mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace; color-scheme: dark;
}
html.bz-intro body { background: radial-gradient(1200px 600px at 75% -10%, rgba(139, 92, 246, .16), transparent 60%), radial-gradient(900px 500px at 0% 20%, rgba(217, 70, 239, .08), transparent 60%), var(--paper); }
html.bz-intro .site-header { --accent: #2ee6a6; background: rgba(11, 11, 18, .9); }

.bzi { display: grid; gap: 28px; padding-block: 40px 56px; }
.bzi-hero { display: grid; gap: 14px; max-width: 760px; }
.bzi-badge { justify-self: start; display: inline-flex; align-items: center; gap: 8px; font-size: .78rem; font-weight: 650; letter-spacing: .04em; color: #ddd6fe;
  padding: 6px 12px; border-radius: 999px; border: 1px solid rgba(139, 92, 246, .45); background: var(--bz-violet-soft); }
.bzi-dot { width: 8px; height: 8px; border-radius: 50%; background: linear-gradient(135deg, var(--bz-violet), var(--bz-pink)); box-shadow: 0 0 10px rgba(217, 70, 239, .6); }
.bzi-eyebrow { font-size: .8rem; font-weight: 750; letter-spacing: .28em; text-transform: uppercase; color: var(--bz-violet); }
.bzi-hero h1 { margin: 0; font-size: clamp(2rem, 5vw, 3.1rem); line-height: 1.08; letter-spacing: -0.025em; text-wrap: balance;
  background: linear-gradient(100deg, #fff 30%, #e9d5ff 70%, #f5d0fe); -webkit-background-clip: text; background-clip: text; color: transparent; }
.bzi-lead { margin: 0; font-size: 1.12rem; color: var(--ink-2); max-width: 64ch; }
.bzi-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 6px; }
.bzi-btn { display: inline-flex; align-items: center; gap: 8px; padding: 12px 18px; border-radius: 10px; font-weight: 650; text-decoration: none;
  color: var(--ink); border: 1px solid var(--line-2); background: rgba(255, 255, 255, .02); transition: background .2s, border-color .2s, transform .12s; }
.bzi-btn:hover { border-color: #4a4a63; background: var(--bz-card); }
.bzi-btn:active { transform: scale(.98); }
.bzi-btn.primary { color: #fff; border-color: transparent; background: linear-gradient(135deg, var(--bz-violet-strong), #a21caf); box-shadow: 0 8px 28px rgba(124, 58, 237, .35); }
.bzi-btn.primary:hover { filter: brightness(1.08); }

.bzi-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 16px; }
.bzi-card { position: relative; display: grid; gap: 10px; align-content: start; padding: 22px; border-radius: 14px; background: var(--bz-card); border: 1px solid var(--line); overflow: hidden; }
.bzi-card::before { content: ""; position: absolute; inset: 0 0 auto; height: 2px; background: linear-gradient(90deg, var(--bz-violet), var(--bz-pink)); opacity: .7; }
.bzi-card h2 { margin: 0; font-size: 1.08rem; }
.bzi-card p { margin: 0; color: var(--ink-2); font-size: .95rem; }
.bzi-ico { width: 42px; height: 42px; border-radius: 10px; display: grid; place-items: center; color: #c4b5fd; background: var(--bz-violet-soft); border: 1px solid rgba(139, 92, 246, .35); }
.bzi-ico svg { width: 22px; height: 22px; }

.bzi-invite { display: grid; gap: 12px; padding: clamp(20px, 4vw, 32px); border-radius: 16px; background: linear-gradient(180deg, rgba(139, 92, 246, .10), var(--bz-card));
  border: 1px solid rgba(139, 92, 246, .45); }
.bzi-invite h2 { margin: 0; font-size: 1.3rem; }
.bzi-invite p { margin: 0; color: var(--ink-2); max-width: 70ch; }
.bzi-invite a { color: #c4b5fd; }
.bzi-note { font-size: .88rem; color: var(--ink-3) !important; border-top: 1px solid var(--line); padding-top: 12px; }