:root {
  --ink: #141516;
  --page: #b7bdbd;
  --teal: #1f7d70;
  --teal-bright: #14655a;
  --muted: #4d5455;
  --fade-top: #b7bdbd;
  --pine: #b7bdbd;
  --sand: #cfc0a9;
  --sand-deep: #b6a78f;
  --dark: #141516;
  --hi: #5fd3c0;
  --rule: rgba(20,21,22,.16);
}
body { color: var(--ink); }
::selection { background: var(--teal); color: #fff; }

.hero-media::after {
  background: linear-gradient(to top,
    var(--page) 0%,
    rgba(183,189,189,.85) 8%,
    rgba(183,189,189,.45) 22%,
    rgba(183,189,189,.22) 45%,
    rgba(183,189,189,.12) 75%,
    rgba(183,189,189,.06) 100%);
}
.hero h1, .page-head h1, .bio h1 { color: var(--ink); --hs: var(--sand); }

.menu a { color: #fff; text-shadow: none; }
.menu a:hover { color: #fff; }
body.nav-stuck .menu a,
body.nav-stuck .social-bar a { color: var(--muted); filter: none; }
body.nav-stuck .menu a:hover { color: var(--ink); }
body.nav-stuck .social-bar a:hover,
body.nav-stuck .menu a[aria-current="page"] { color: var(--teal); }

.nav-toggle span { background: #fff; }
body.nav-stuck .nav-toggle span { background: var(--muted); }
@media (max-width: 760px) {
  .topbar:has(.nav-links.open) { background: var(--page); }
  .topbar:has(.nav-links.open) .nav-toggle span { background: var(--muted); }
  .topbar:has(.nav-links.open) .social-bar a { color: var(--muted); filter: none; }
  .topbar .nav-links { background: var(--page); box-shadow: 0 20px 40px rgba(20,21,22,.25); }
  .topbar .nav-links a,
  body.nav-stuck .topbar .nav-links a { color: var(--ink); border-bottom-color: rgba(20,21,22,.12); }
  .topbar .nav-links a:hover,
  body.nav-stuck .topbar .nav-links a:hover,
  .topbar .nav-links a[aria-current="page"],
  body.nav-stuck .topbar .nav-links a[aria-current="page"] { color: var(--teal); }
}

.cue-band { background: var(--page); }
.scroll-cue { color: var(--ink); }
.section--fade { background: var(--page); }
.lede { color: #232627; }
.eyebrow { color: var(--muted); }
.link:hover { color: var(--teal); }
.btn, .btn--solid { background: var(--ink); color: var(--page); }
.btn:hover, .btn--solid:hover { background: var(--teal); color: #fff; }

.section--sand .lede { color: #2a2a26; }

.section--ink { background: var(--dark); color: #eceeee; }
.section--ink .eyebrow::before { color: var(--hi); }
.section--ink .link { text-decoration-color: var(--hi); }
.viz { --viz-lo: #2f9484; --viz-mid: var(--page); --viz-hi: var(--sand); --viz-alpha: .28; }

.footer { background: var(--dark); color: #eceeee; border-top: 0; }
.footer .social-row a { color: #8f9899; }
.footer .social-row a:hover { color: var(--hi); }
.footer .fine { color: rgba(143,152,153,.6); }

/* Dark bar for pages that are black from the top (music). Same states as
   the grey bar, inverted: muted at rest, light on hover, teal current. */
body.nav-stuck .topbar--dark {
  background: color-mix(in srgb, var(--dark) 94%, transparent);
  box-shadow: 0 1px 0 rgba(236,238,238,.08);
}
body.nav-stuck .topbar--dark .menu a,
body.nav-stuck .topbar--dark .social-bar a { color: #8f9899; }
body.nav-stuck .topbar--dark .menu a:hover,
body.nav-stuck .topbar--dark .social-bar a:hover { color: #eceeee; }
body.nav-stuck .topbar--dark .menu a[aria-current="page"] { color: var(--hi); }
body.nav-stuck .topbar--dark .nav-toggle span { background: #8f9899; }
@media (max-width: 760px) {
  .topbar--dark:has(.nav-links.open) { background: var(--dark); }
  .topbar--dark:has(.nav-links.open) .nav-toggle span { background: #8f9899; }
  .topbar--dark:has(.nav-links.open) .social-bar a { color: #8f9899; }
  .topbar--dark .nav-links { background: var(--dark); box-shadow: 0 20px 40px rgba(0,0,0,.4); }
  .topbar--dark .nav-links a,
  body.nav-stuck .topbar--dark .nav-links a { color: #eceeee; border-bottom-color: rgba(236,238,238,.12); }
  .topbar--dark .nav-links a:hover,
  body.nav-stuck .topbar--dark .nav-links a:hover,
  .topbar--dark .nav-links a[aria-current="page"],
  body.nav-stuck .topbar--dark .nav-links a[aria-current="page"] { color: var(--hi); }
}

.topbar--dark {
  background: color-mix(in srgb, var(--dark) 94%, transparent);
  box-shadow: 0 1px 0 rgba(236,238,238,.08);
}
.topbar--dark .brand { color: #eceeee; }
.topbar--dark .brand:hover { color: var(--hi); }
.topbar--dark .menu a,
.topbar--dark .social-bar a { color: #8f9899; }
.topbar--dark .menu a:hover,
.topbar--dark .social-bar a:hover { color: #eceeee; }
.topbar--dark .menu a[aria-current="page"] { color: var(--hi); }
.topbar--dark .nav-toggle span { background: #8f9899; }

.topbar .brand { color: #fff; }
.topbar .brand:hover { color: #fff; }
body.nav-stuck .topbar .brand { color: var(--ink); }
body.nav-stuck .topbar .brand:hover { color: var(--teal); }
body.nav-stuck .topbar--dark .brand { color: #eceeee; }
body.nav-stuck .topbar--dark .brand:hover { color: var(--hi); }
@media (max-width: 760px) {
  .topbar:has(.nav-links.open) .brand { color: var(--ink); }
  .topbar--dark:has(.nav-links.open) .brand { color: #eceeee; }
}

.page--dark {
  --page: var(--dark);
  --pine: var(--dark);
  --fade-top: var(--dark);
  --rule: rgba(236,238,238,.16);
  --muted: #8f9899;
  background: var(--dark);
  color: #eceeee;
}
.page--dark .page-head h1 { color: #eceeee; --hs: var(--sand); }
.page--dark h2 { color: #eceeee; }
.page--dark .link { text-decoration-color: var(--hi); }
.page--dark .link:hover { color: var(--hi); }
.page--dark .muted { color: #8f9899; }
.page--dark .btn, .page--dark .btn--solid { background: #eceeee; color: var(--ink); }
.page--dark .btn:hover, .page--dark .btn--solid:hover { background: var(--sand); color: var(--ink); }
.page--dark .footer { border-top: 1px solid rgba(236,238,238,.08); }

.page--tint {
  --tint: #2b2f30;
  --rule: rgba(236,238,238,.16);
  --muted: #d5dada;
  --page-bg-color: var(--tint);
  --page-bg-pos: 46% 25%;
  --page-bg-opacity: .42;
  background: var(--tint);
  color: #eceeee;
}
/* Background photos come from the CMS (inline --page-bg-img on <body>). */
.page--music { --page-bg-pos: 60% 40%; }
.page--tint .page-head h1 { color: #eceeee; --hs: var(--sand); }
.page--tint .tour-list .date { color: var(--sand); }
.page--tint .link { text-decoration-color: var(--hi); }
.page--tint .link:hover { color: var(--hi); }
.page--tint .btn, .page--tint .btn--solid { background: #eceeee; color: var(--ink); }
.page--tint .btn:hover, .page--tint .btn--solid:hover { background: var(--sand); color: var(--ink); }
body.nav-stuck .topbar--tint { background: color-mix(in srgb, var(--tint) 94%, transparent); }
@media (max-width: 760px) {
  .topbar--tint:has(.nav-links.open),
  .topbar--tint .nav-links { background: var(--tint); }
}

.field input, .field textarea {
  color: var(--ink);
  background: rgba(20,21,22,.05);
  border-color: rgba(20,21,22,.3);
}
.field .hint, .form-note { color: var(--muted); }
.field input::placeholder, .field textarea::placeholder { color: #33393a; font-style: italic; opacity: 1; }
.form-status.ok { color: var(--teal-bright); }
.form-status.err { color: #7a2f26; }

.page--brick {
  --tint: #cfc0a9;
  --rule: rgba(20,21,22,.16);
  background-color: var(--tint);
  background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M54.627 0l.83.828-1.415 1.415L51.8 0h2.827zM5.373 0l-.83.828L5.96 2.243 8.2 0H5.374zM48.97 0l3.657 3.657-1.414 1.414L46.143 0h2.828zM11.03 0L7.372 3.657 8.787 5.07 13.857 0H11.03zm32.284 0L49.8 6.485 48.384 7.9l-7.9-7.9h2.83zM16.686 0L10.2 6.485 11.616 7.9l7.9-7.9h-2.83zm20.97 0l9.315 9.314-1.414 1.414L34.828 0h2.83zM22.344 0L13.03 9.314l1.414 1.414L25.172 0h-2.83zM32 0l12.142 12.142-1.414 1.414L30 .828 17.272 13.556l-1.414-1.414L28 0h4zM.284 0l28 28-1.414 1.414L0 2.544V0h.284zM0 5.373l25.456 25.455-1.414 1.415L0 8.2V5.374zm0 5.656l22.627 22.627-1.414 1.414L0 13.86v-2.83zm0 5.656l19.8 19.8-1.415 1.413L0 19.514v-2.83zm0 5.657l16.97 16.97-1.414 1.415L0 25.172v-2.83zM0 28l14.142 14.142-1.414 1.414L0 30.828V28zm0 5.657L11.314 44.97 9.9 46.386l-9.9-9.9v-2.828zm0 5.657L8.485 47.8 7.07 49.212 0 42.143v-2.83zm0 5.657l5.657 5.657-1.414 1.415L0 47.8v-2.83zm0 5.657l2.828 2.83-1.414 1.413L0 53.456v-2.83zM54.627 60L30 35.373 5.373 60H8.2L30 38.2 51.8 60h2.827zm-5.656 0L30 41.03 11.03 60h2.828L30 43.858 46.142 60h2.83zm-5.656 0L30 46.686 16.686 60h2.83L30 49.515 40.485 60h2.83zm-5.657 0L30 52.343 22.343 60h2.83L30 55.172 34.828 60h2.83zM32 60l-2-2-2 2h4zM59.716 0l-28 28 1.414 1.414L60 2.544V0h-.284zM60 5.373L34.544 30.828l1.414 1.415L60 8.2V5.374zm0 5.656L37.373 33.656l1.414 1.414L60 13.86v-2.83zm0 5.656l-19.8 19.8 1.415 1.413L60 19.514v-2.83zm0 5.657l-16.97 16.97 1.414 1.415L60 25.172v-2.83zM60 28L45.858 42.142l1.414 1.414L60 30.828V28zm0 5.657L48.686 44.97l1.415 1.415 9.9-9.9v-2.828zm0 5.657L51.515 47.8l1.414 1.413 7.07-7.07v-2.83zm0 5.657l-5.657 5.657 1.414 1.415L60 47.8v-2.83zm0 5.657l-2.828 2.83 1.414 1.413L60 53.456v-2.83zM39.9 16.385l1.414-1.414L30 3.658 18.686 14.97l1.415 1.415 9.9-9.9 9.9 9.9zm-2.83 2.828l1.415-1.414L30 9.313 21.515 17.8l1.414 1.413 7.07-7.07 7.07 7.07zm-2.827 2.83l1.414-1.416L30 14.97l-5.657 5.657 1.414 1.415L30 17.8l4.243 4.242zm-2.83 2.827l1.415-1.414L30 20.626l-2.828 2.83 1.414 1.414L30 23.456l1.414 1.414zM56.87 59.414L58.284 58 30 29.716 1.716 58l1.414 1.414L30 32.544l26.87 26.87z' fill='%23b6a78f' fill-opacity='0.44' fill-rule='evenodd'/%3E%3C/svg%3E");
  color: var(--ink);
}
.page--brick .page-head h1 { color: var(--ink); --hs: var(--teal); }
.page--brick .link { text-decoration-color: var(--teal); }
.page--brick .field input, .page--brick .field textarea {
  color: var(--ink);
  background: rgba(20,21,22,.06);
  border-color: rgba(20,21,22,.3);
}
.page--brick .field input::placeholder, .page--brick .field textarea::placeholder { color: #4a4638; }
.page--brick .btn, .page--brick .btn--solid { background: var(--ink); color: var(--sand); }
.page--brick .btn:hover, .page--brick .btn--solid:hover { background: var(--teal); color: #fff; }

body.page--brick.nav-stuck .topbar { box-shadow: 0 1px 0 rgba(20,21,22,.08); }
body.page--brick.nav-stuck .topbar .menu a,
body.page--brick.nav-stuck .topbar .social-bar a,
body.page--brick.nav-stuck .topbar .brand { color: #55523f; }
body.page--brick.nav-stuck .topbar .nav-toggle span { background: #55523f; }
body.page--brick.nav-stuck .topbar .menu a:hover,
body.page--brick.nav-stuck .topbar .social-bar a:hover,
body.page--brick.nav-stuck .topbar .brand:hover { color: var(--ink); }
body.page--brick.nav-stuck .topbar .menu a[aria-current="page"] { color: var(--teal); }
@media (max-width: 760px) {
  body.page--brick .topbar .nav-links a,
  body.page--brick.nav-stuck .topbar .nav-links a { color: var(--ink); border-bottom-color: rgba(20,21,22,.12); }
  body.page--brick .topbar .nav-links a:hover,
  body.page--brick.nav-stuck .topbar .nav-links a:hover,
  body.page--brick .topbar .nav-links a[aria-current="page"],
  body.page--brick.nav-stuck .topbar .nav-links a[aria-current="page"] { color: var(--teal); }
  body.page--brick .topbar:has(.nav-links.open) .nav-toggle span { background: #55523f; }
  body.page--brick .topbar:has(.nav-links.open) .social-bar a,
  body.page--brick .topbar:has(.nav-links.open) .brand { color: #55523f; }
}

.page--mentorship .section--sand { background: #2b2f30; color: #eceeee; }
.page--mentorship .section--sand h2 { color: #eceeee; }
.page--mentorship .section--sand .muted { color: #b9c0c0; }
