/* The studio's blue palette, shared by light and dark modes. */
:root {
  --bg: #0e1723;
  --panel: #162433;
  --panel2: #1d3042;
  --text: #eef5fb;
  --muted: #acbfce;
  --line: #395368;
  --accent: #85c4ff;
  --accent2: #85c4ff;
}
body.light {
  --bg: #f4f8fc;
  --panel: #ffffff;
  --panel2: #e9f1f8;
  --text: #172b3e;
  --muted: #4c6376;
  --line: #c7d7e6;
  --accent: #155f9c;
  --accent2: #155f9c;
}
.workflow-hero {
  --wf-bg: #0e1723;
  --wf-ink: #eef5fb;
  --wf-muted: #acbfce;
  --wf-accent: #85c4ff;
  --wf-line: #85c4ff43;
}
body.light .workflow-hero {
  --wf-bg: #f4f8fc;
  --wf-ink: #172b3e;
  --wf-muted: #4c6376;
  --wf-accent: #155f9c;
}
.workflow-hero__visual {
  background: linear-gradient(145deg, #142b40, #0b1827);
  border-color: #91bce83b;
}
body.light .workflow-hero__primary:hover,
body.light .workflow-hero__primary:focus-visible { background: #0d4a7a; color: #fff; }
body.light .workflow-hero__primary:focus-visible,
body.light .workflow-hero__text-link:focus-visible,
body.light .workflow-hero__skip:focus-visible { outline-color: #155f9c; }