/* Brightwork site extras (2026-10): theme toggle, spark accents, gentle motion, mid-page CTA band.
   Loaded after each page's own <style>, so it can build on the page's color tokens. */

:root { color-scheme: light; --spark: #E2832A; --spark-2: #E3B740; --band: #FBF6EC; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { color-scheme: dark; --spark: #F2A84F; --spark-2: #F2D77E; --band: #131931; } }
:root[data-theme="dark"] { color-scheme: dark; --spark: #F2A84F; --spark-2: #F2D77E; --band: #131931; }

/* ---------- Light / dark toggle ---------- */
.nav .wordmark { margin-right: auto; }
.nav .nav-links { order: 2; }
.nav .nav-toggle { order: 4; }
.bw-theme { order: 3; margin-left: 22px; flex: none; display: inline-flex; align-items: center; justify-content: center;
  width: 38px; height: 38px; padding: 0; border: 1.5px solid var(--line); border-radius: 50%; background: none;
  color: var(--ink); cursor: pointer; transition: border-color .2s, color .2s, transform .35s; }
.bw-theme:hover, .bw-theme:focus-visible { border-color: var(--spark); color: var(--spark); transform: rotate(-18deg); }
.bw-theme:focus-visible { outline: 2px solid var(--aurora); outline-offset: 2px; }
.bw-theme svg { width: 18px; height: 18px; }
@media (max-width: 760px) {
  .nav .nav-links { order: 5; }
  .bw-theme { margin: 0 10px 0 0; }
}
.bw-theme-foot { background: none; border: 0; padding: 0; font: inherit; color: var(--muted); cursor: pointer; display: inline-flex; align-items: center; gap: 5px; }
.bw-theme-foot:hover, .bw-theme-foot:focus-visible { color: var(--star); }
.bw-theme-foot svg { width: 13px; height: 13px; }
.bw-theme-menu { display: none; }
@media (max-width: 480px) {
  .nav > .bw-theme { display: none; }
  .bw-theme-menu { display: inline-flex; font-size: 1.05rem; font-weight: 500; padding: 12px 4px; gap: 9px; }
  .bw-theme-menu svg { width: 17px; height: 17px; }
}

/* ---------- Orange spark accents ---------- */
.eyebrow::before { content: ""; display: inline-block; width: 1.5em; height: 1.5em; margin-right: 0.45em; vertical-align: -0.45em;
  background: url("/assets/bw-spark.svg") center / contain no-repeat; }
.prose h2::after, .sec-head h2::after { content: ""; display: block; width: 46px; height: 3px; margin-top: 12px; border-radius: 2px;
  background: linear-gradient(90deg, var(--spark), var(--spark-2)); }
.btn-solid { background: var(--spark); border-color: var(--spark); color: #1C2340; }
.btn-solid:hover, .btn-solid:focus-visible { background: var(--spark-2); border-color: var(--spark-2); color: #1C2340; }

/* Alternate warm bands so long pages have visible chapters */
.wrap > section:nth-of-type(even):not(.contact) { background: var(--band); box-shadow: 0 0 0 100vmax var(--band); clip-path: inset(0 -100vmax); }

/* Cards that lead somewhere lift slightly on hover */
.card:has(a), .prog:has(a) { transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.card:has(a):hover, .prog:has(a):hover { transform: translateY(-3px); border-color: var(--spark); box-shadow: 0 12px 28px rgba(19, 26, 54, 0.12); }

/* ---------- Mid-page CTA band ---------- */
.bw-cta { position: relative; overflow: hidden; display: flex; flex-wrap: wrap; align-items: center; gap: 22px 36px;
  background: var(--night); color: var(--night-ink); border-radius: 10px; padding: 34px 38px 34px 96px; margin: 0 0 68px;
  background-image: radial-gradient(1.2px 1.2px at 18% 30%, rgba(240,230,200,.8) 50%, transparent 51%),
    radial-gradient(1px 1px at 44% 74%, rgba(240,230,200,.5) 50%, transparent 51%),
    radial-gradient(1.3px 1.3px at 68% 22%, rgba(240,230,200,.7) 50%, transparent 51%),
    radial-gradient(1px 1px at 90% 64%, rgba(240,230,200,.55) 50%, transparent 51%),
    linear-gradient(115deg, rgba(242,168,79,.16), transparent 45%); }
.bw-cta::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: linear-gradient(180deg, var(--spark-2), var(--spark)); }
.bw-cta-spark { position: absolute; left: 30px; top: 50%; width: 46px; height: 46px; margin-top: -23px; background: url("/assets/bw-spark.svg") center / contain no-repeat; }
.bw-cta-body { flex: 1 1 320px; }
.bw-cta .bw-cta-h { font-size: 1.3rem; font-weight: 700; line-height: 1.25; margin: 0 0 6px; color: var(--night-ink); text-wrap: balance; }
.bw-cta .bw-cta-p { margin: 0; opacity: .85; font-size: .98rem; max-width: 56ch; }
.bw-cta-btns { display: flex; flex-wrap: wrap; gap: 12px; }
.bw-cta a.btn:not(.btn-solid) { color: var(--star-bright); border-color: var(--star-bright); }
.bw-cta a.btn:not(.btn-solid):hover, .bw-cta a.btn:not(.btn-solid):focus-visible { background: var(--star-bright); color: #131A36; }
.prose .bw-cta { margin: 44px 0; }
@media (max-width: 640px) {
  .bw-cta { padding: 76px 24px 28px; }
  .bw-cta-spark { left: 24px; top: 22px; margin-top: 0; width: 40px; height: 40px; }
}

/* ---------- Gentle motion (only when JS runs and the visitor allows motion) ---------- */
@media (prefers-reduced-motion: no-preference) {
  .bw-anim .gleam:not(.bw-go)::before { transform: scaleX(0); }
  .bw-anim .gleam:not(.bw-go)::after { scale: 0; }
  .bw-anim .gleam.bw-go::before { transform-origin: left center; animation: bw-draw 1s cubic-bezier(.2,.7,.2,1) both; }
  .bw-anim .gleam.bw-go::after { animation: bw-pop .8s .45s cubic-bezier(.3,1.5,.5,1) both, bw-twinkle 5s 2.2s ease-in-out infinite; }
  .bw-cta-spark { animation: bw-twinkle 4.5s ease-in-out infinite; }
  .bw-anim .bw-rv { opacity: 0; transform: translateY(18px); transition: opacity .7s ease, transform .7s cubic-bezier(.2,.7,.2,1); }
  .bw-anim .bw-rv.bw-go { opacity: 1; transform: none; }
}
@keyframes bw-draw { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes bw-pop { from { scale: 0; rotate: -120deg; } to { scale: 1; rotate: 0deg; } }
@keyframes bw-twinkle { 0%, 100% { scale: 1; filter: none; } 50% { scale: 1.12; filter: drop-shadow(0 0 7px rgba(242,168,79,.7)); } }
@media print { .bw-anim .bw-rv { opacity: 1 !important; transform: none !important; } .bw-theme, .bw-cta { display: none; } }