:root {
  --md-text-font: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --md-code-font: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  --md-primary-fg-color: #123c43;
  --md-primary-fg-color--light: #21535b;
  --md-primary-fg-color--dark: #092d34;
  --md-accent-fg-color: #087e8b;
  --pv-border: #dce6e6;
  --pv-soft: #f0f6f5;
  --pv-muted: #526a70;
}

[data-md-color-scheme="slate"] {
  --md-hue: 195;
  --md-primary-fg-color: #123c43;
  --md-accent-fg-color: #80e2d2;
  --md-typeset-a-color: #80e2d2;
  --pv-border: #34494f;
  --pv-soft: #20353b;
  --pv-muted: #abc1c6;
}

.md-header__topic:first-child {
  font-weight: 750;
  letter-spacing: -.03em;
}

.md-typeset h1,
.md-typeset h2,
.md-typeset h3 {
  letter-spacing: -.035em;
  font-weight: 650;
}

.md-typeset h1 {
  color: var(--md-default-fg-color);
}

.md-typeset .md-button {
  border-radius: .35rem;
  padding: .55em 1.2em;
  font-size: .8rem;
}

[data-md-color-scheme="slate"] .md-typeset .md-button:not(.md-button--primary) {
  color: var(--md-typeset-a-color);
  border-color: currentColor;
}

[data-md-color-scheme="slate"] .md-typeset .md-button:not(.md-button--primary):hover,
[data-md-color-scheme="slate"] .md-typeset .md-button:not(.md-button--primary):focus {
  color: #123c43;
}

.md-typeset pre > code,
.md-typeset .highlight {
  border-radius: .4rem;
}

.pv-hero {
  padding: 1.8rem 0 2.2rem;
  border-bottom: 1px solid var(--pv-border);
}

.md-typeset .pv-eyebrow {
  color: var(--md-typeset-a-color);
  font-size: .65rem;
  font-weight: 750;
  letter-spacing: .13em;
  text-transform: uppercase;
  margin: 0 0 1rem;
}

.md-typeset .pv-hero h1 {
  font-size: clamp(2.2rem, 4.8vw, 3.6rem);
  line-height: 1.07;
  letter-spacing: -.055em;
  max-width: 15ch;
  margin: 0 0 1rem;
  font-weight: 750;
}

.md-typeset .pv-lead {
  color: var(--pv-muted);
  font-size: 1.03rem;
  line-height: 1.7;
  max-width: 40rem;
}

.pv-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .65rem;
  margin: 1.3rem 0;
}

.md-typeset .pv-meta {
  color: var(--pv-muted);
  font-size: .67rem;
  margin-bottom: 0;
}

.pv-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
  margin: 1.5rem 0 2rem;
}

.pv-card {
  padding: 1.2rem;
  border: 1px solid var(--pv-border);
  border-radius: .55rem;
  background: var(--pv-soft);
}

.md-typeset .pv-card h3 {
  margin: 0 0 .5rem;
  font-size: .95rem;
}

.md-typeset .pv-card p {
  color: var(--pv-muted);
  font-size: .76rem;
  margin-bottom: 0;
}

.pv-flow {
  display: grid;
  grid-template-columns: 1fr auto 1fr auto 1fr;
  gap: .8rem;
  align-items: center;
  padding: 1.2rem;
  border: 1px solid var(--pv-border);
  border-radius: .55rem;
  margin: 1.5rem 0;
}

.pv-flow-step {
  text-align: center;
}

.pv-flow-step strong {
  display: block;
  font-size: .82rem;
}

.pv-flow-step span {
  display: block;
  font-size: .66rem;
  color: var(--pv-muted);
  margin-top: .3rem;
}

.pv-flow-arrow {
  color: var(--md-typeset-a-color);
  font-size: 1.3rem;
}

@media (max-width: 600px) {
  .pv-grid { grid-template-columns: 1fr; }
  .pv-hero { padding-top: .5rem; }
  .pv-flow { grid-template-columns: 1fr; gap: .6rem; }
  .pv-flow-arrow { text-align: center; transform: rotate(90deg); }
}
