.product-illustration { margin: 0; overflow: hidden; border: 1px solid var(--color-illustration-border); border-radius: var(--space-3); box-shadow: var(--image-shadow); background: var(--color-illustration-background); }

.product-illustration > svg { display: block; width: 100%; height: auto; }

.product-illustration .canvas { fill: var(--color-illustration-background); }

.product-illustration .panel, .product-illustration .card { fill: var(--color-illustration-panel); }

.product-illustration .divider, .product-illustration .card { stroke: var(--color-illustration-border); }

.product-illustration .selection { fill: var(--color-illustration-selection); }

.product-illustration .text-line { fill: var(--color-illustration-secondary); opacity: .45; }

.product-illustration .subtle-line { fill: var(--color-illustration-secondary); opacity: .2; }

.product-illustration .accent { fill: var(--color-accent); }

.product-illustration .focused { stroke: var(--color-accent); }

.product-illustration .icon { color: var(--color-illustration-secondary); }

.product-illustration .muted-icon { color: var(--color-illustration-muted); }

.product-illustration text { fill: var(--color-illustration-text); font-family: inherit; }

.product-illustration .label { font-size: var(--type-small-size); }

.product-illustration .muted { fill: var(--color-illustration-secondary); }

.product-illustration .strong { font-weight: var(--type-weight-emphasis); }

.product-illustration .heading { font-size: var(--type-illustration-heading-size); font-weight: var(--type-weight-emphasis); }

.product-illustration .inverse { fill: var(--color-button-primary-text); color: var(--color-button-primary-text); }

.product-illustration .dropzone { fill: none; stroke: var(--color-illustration-muted); stroke-dasharray: 4 4; opacity: .5; }

.product-illustration .tone-0 { fill: var(--color-illustration-selection); }

.product-illustration .tone-1 { fill: var(--color-illustration-prospects); }

.product-illustration .tone-2 { fill: var(--color-illustration-followups); }

.product-illustration .tone-3 { fill: var(--color-illustration-pipeline); }

.product-illustration .tone-4 { fill: var(--color-illustration-deals); }

.product-illustration .tone-5 { fill: var(--color-illustration-customers); }

.product-illustration .tone-6 { fill: var(--color-illustration-contacts); }

.product-illustration .menu-icon-0 { color: var(--color-illustration-icon-default); }

.product-illustration .menu-icon-1 { color: var(--color-illustration-icon-prospects); }

.product-illustration .menu-icon-2 { color: var(--color-illustration-icon-followups); }

.product-illustration .menu-icon-3 { color: var(--color-illustration-icon-pipeline); }

.product-illustration .menu-icon-4 { color: var(--color-illustration-icon-deals); }

.product-illustration .menu-icon-5 { color: var(--color-illustration-icon-customers); }

.product-illustration .menu-icon-6 { color: var(--color-illustration-icon-contacts); }

.product-illustration .success { fill: var(--color-illustration-success); }
product-illustration-demo[data-astro-cid-j2i7lacg] {
  display: block;
  position: relative;
}

[data-astro-cid-j2i7lacg][hidden] {
  display: none;
}

.demo-navigation[data-astro-cid-j2i7lacg] {
  display: none;
  position: absolute;
  left: .933333%;
  top: 11.1392%;
  width: 12.8%;
  height: 28.8608%;
  grid-template-rows: repeat(6, 1fr);
}

product-illustration-demo[data-astro-cid-j2i7lacg][data-ready] .demo-navigation[data-astro-cid-j2i7lacg] {
  display: grid;
}

button[data-astro-cid-j2i7lacg] {
  appearance: none;
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
  border-radius: var(--space-1);
}

button[data-astro-cid-j2i7lacg]:hover {
  box-shadow: inset 0 0 0 1px var(--color-illustration-border);
}

button[data-astro-cid-j2i7lacg]:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 0;
}
.hero-logos[data-astro-cid-v6qghxz3] {
  grid-column: 1 / -1;
  min-width: 0;
}

.hero[data-astro-cid-v6qghxz3].center {
  text-align: center;
}

.center[data-astro-cid-v6qghxz3] .block-copy[data-astro-cid-v6qghxz3] {
  max-width: 960px;
  margin-inline: auto;
}

.center[data-astro-cid-v6qghxz3] p {
  margin-inline: auto;
}

.center[data-astro-cid-v6qghxz3] .block-actions[data-astro-cid-v6qghxz3] {
  justify-content: center;
}

.hero[data-astro-cid-v6qghxz3] {
  display: grid;
  gap: var(--block-column-gap);
}

.hero[data-astro-cid-v6qghxz3].muted {
  position: relative;
  isolation: isolate;
  padding-block: var(--hero-padding-block);
}

.hero[data-astro-cid-v6qghxz3].muted:before {
  content: "";
  position: absolute;
  z-index: -1;
  inset-block: 0;
  inset-inline: calc((100% - 100vw) / 2 + var(--page-gutter));
  background: var(--color-surface);
  border-radius: clamp(24px, 3vw, 40px);
  pointer-events: none;
}

@media (width >= 800px) {
  .hero[data-astro-cid-v6qghxz3].muted.split {
    min-height: 620px;
  }
}

@media (width >= 800px) {
  .left[data-astro-cid-v6qghxz3].split {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: center;
  }
}