/* Shared light palette. Keep page content, signature logo, and embeds intact. */
:root {
  --site-background: #f3f1f6;
  --site-ink: #21173b;
  --site-muted: #51495e;
  --site-purple: #6434eb;
  --site-link: #5426ce;
  --site-line: #ded9e8;
}
body, body.practice-page {
  margin: 0;
  background: var(--site-background);
  color: var(--site-ink);
}
.practice-page {
  --ink: var(--site-ink);
  --muted: var(--site-muted);
  --purple: var(--site-purple);
  --line: var(--site-line);
}
a, .practice-page a { color: var(--site-link); }
.site-header, .practice-page .site-header { border-color: var(--site-line); }
.site-header .brand, .practice-page .brand,
.header-content h1.cursive, .header-content h1.cursive a {
  color: var(--site-purple);
}
.site-header nav a, .practice-page nav a, #nav .nav a {
  color: var(--site-ink);
}
.site-header nav a[aria-current="page"],
.practice-page nav a[aria-current="page"],
.site-header nav a:hover, #nav .nav a:hover {
  color: var(--site-link);
}
.site-header a:focus-visible, #nav a:focus-visible {
  outline-color: var(--site-purple);
}
.bio, .practice-page h1, .practice-page h2, .practice-page h3 {
  color: var(--site-ink);
}
.practice-page .lead, .practice-page .details,
.practice-page .learning-grid p, .practice-page .section p,
.practice-page .lesson-shortcut, .practice-page .site-footer,
.practice-page .signup-card > p {
  color: var(--site-muted);
}
.practice-page .eyebrow { color: var(--site-link); }
.practice-page .number { color: #754dc9; }
.practice-page .signup-card {
  background: #fff;
  color: var(--site-ink);
}
.practice-page .signup-card h2 { color: var(--site-ink); }
.practice-page .signup-card .ml-form-embedWrapper { background: #fff !important; }
.practice-page .signup-card .ml-form-successContent h4 { color: var(--site-ink) !important; }
.practice-page .signup-card .ml-form-successContent p { color: var(--site-muted) !important; }
.practice-page .article th { background: #e9e4f1; color: var(--site-ink); }
.practice-page .button { background: var(--site-purple); color: #fff; }
/* Homepage lettering overlays the video without a header backdrop. */
.v-header { color: #fff; }
.v-header .brand,
.v-header .site-header nav a {
  color: #fff;
  text-shadow: 0 2px 5px #000c, 0 0 16px #0008;
}
.v-header .site-header nav a:hover {
  color: #fff;
  text-decoration: underline;
  text-underline-offset: 4px;
}
.v-header .site-header a:focus-visible { outline-color: #fff; }
#unmuteButton {
  background: #0006;
  border-color: #fff;
  color: #fff;
  text-shadow: 0 1px 3px #000c;
}

/* Match every page's header geometry while floating above the homepage video. */
html { scrollbar-gutter: stable; }
.v-header .homepage-header {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
  border-bottom-color: transparent;
}
