.codex-canvas-bg {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}
.codex-canvas-bg canvas {
  display: block;
  width: 100%;
  height: 100%;
}

/* Some pages have leftover empty content grids reserving blank vertical
   space before the footer. Collapse any fluid-engine section with no
   actual blocks inside it. */
.fluid-engine:empty {
  display: none !important;
}
.page-section:has(.fluid-engine:empty):not(:has(.fe-block)) {
  display: none !important;
}
.page-section:has(.blog-side-by-side-wrapper):not(:has(article)) {
  display: none !important;
}
#footer-sections img[src*="logo+large.png"],
#footer-sections img[src*="title.png"] {
  filter: brightness(0) invert(1);
}

/* Hide Squarespace's background pause button */
.background-pause-button {
  display: none !important;
}

/* Header nav text: match footer body text size (was ~13.8px vs 15.6px) */
#header .header-nav-item,
#header .header-nav-item a,
#header .header-nav-folder-title {
  font-size: 1.05em !important;
}

/* Squarespace's scroll-entrance animation splits heading text into
   per-word segment spans (each rendered as its own block), which causes
   headings to wrap one word per line once the animation JS runs. Disable
   it entirely for these specific titles: force any child spans back to
   inline, and kill the animation/transform machinery outright. */
.fe-block-925a9a6845806a1d2a0d h3 {
  animation: none !important;
  transition: none !important;
  transform: none !important;
  opacity: 1 !important;
}
.fe-block-925a9a6845806a1d2a0d h3 *,
.codex-custom-title-2 h3 * {
  display: inline !important;
  white-space: normal !important;
  animation: none !important;
  transition: none !important;
  transform: none !important;
  opacity: 1 !important;
}
.codex-custom-title-2 h3 {
  animation: none !important;
  transition: none !important;
  transform: none !important;
  opacity: 1 !important;
}
#header .header-title-logo img,
#header .header-title-logo svg {
  filter: none;
}

#header .header-background,
#header .theme-bg--primary {
  background: transparent !important;
  background-color: transparent !important;
  opacity: 0 !important;
}
/* Same soft, tapering-veil treatment as the homepage header (dark
   gradient over the canvas there), just in white for these white-page
   headers: a solid start easing down into a longer fade rather than a
   flat block with an abrupt edge. */
body:not(#collection-69dc4165524a8040ff914e1e) #header {
  background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0.97) 35%, rgba(255,255,255,0.85) 58%, rgba(255,255,255,0.55) 78%, rgba(255,255,255,0.2) 92%, rgba(255,255,255,0) 100%) !important;
  min-height: 200px !important;
}
body:not(#collection-69dc4165524a8040ff914e1e) #header .header-background-solid {
  background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0.97) 35%, rgba(255,255,255,0.85) 58%, rgba(255,255,255,0.55) 78%, rgba(255,255,255,0.2) 92%, rgba(255,255,255,0) 100%) !important;
  background-color: transparent !important;
  opacity: 1 !important;
  min-height: 200px !important;
}
#codex-header-canvas-wrap {
  z-index: -1;
}
#header .header-display-desktop,
#header .header-title,
#header .header-title-logo,
#header .header-nav,
#header .header-title-nav-wrapper {
  position: relative;
  z-index: 1;
}

/* Header centering: Squarespace's branding-center-nav-center layout relies
   on empty social/cart action columns on either side to force the middle
   column visually centered. When those are empty/collapsed, the outer
   flex container's default justify-content:flex-start left-packs
   everything instead. Force centering directly, site-wide. */
#header .header-display-desktop {
  display: grid !important;
  grid-template-columns: 1fr auto 1fr !important;
  align-items: center !important;
}
#header .header-title-nav-wrapper {
  grid-column: 2 !important;
  justify-self: center !important;
}
#header .header-actions--right {
  grid-column: 3 !important;
  justify-self: end !important;
}

/* The page body defaults to white; only individual sections carry a dark
   theme, leaving gaps (like the header band) showing white. Make the base
   background dark site-wide and let the header's solid white backing
   become transparent so it matches. */
body {
  background-color: #000 !important;
}
#header .header-background-solid {
  background: linear-gradient(to bottom, #ffffff 0%, #ffffff 76%, #f4f4f4 100%) !important;
  background-color: #ffffff !important;
  opacity: 1 !important;
}