/*
 * SIVEVIS section background system.
 *
 * The page uses one neutral family with explicit depth levels. A gradient may
 * add atmosphere or mask an edge, but it must not become a second section
 * background with its own unrelated colour family.
 */
:root {
  --sivevis-bg-void: #010100;
  --sivevis-bg-content: #030508;
  --sivevis-bg-scene: #07080c;
  --sivevis-bg-media: #0a0d11;
  --sivevis-bg-card: #0e0e10;
}

html,
body {
  background: var(--sivevis-bg-void);
  overflow-x: clip;
}

.sivevis-section {
  color: var(--color-ink-primary, #fff);
}

.sivevis-section.sivevis-section--void {
  background-color: var(--sivevis-bg-void);
}

.sivevis-section.sivevis-section--content {
  background-color: var(--sivevis-bg-content);
}

.sivevis-section.sivevis-section--scene {
  background-color: var(--sivevis-bg-scene);
}

.sivevis-section.sivevis-section--media {
  background-color: var(--sivevis-bg-media);
}

/* Identity sits above the transition film; its more-specific transition rule
 * intentionally keeps the overlay root transparent. */
html body .sivevis-portfolio-item__media,
html body .sivevis-interaction-showcase__media {
  background-color: var(--sivevis-bg-media);
}