/**
 * TRACE master viewport canvas — mesh, copper rays, grid, grain.
 * Linked site-wide; product intro zones opt out via .canvas-intro-shield.
 */
:root {
  /* Trough: same solid as .site-header base (rgb(16, 25, 42)) */
  --viewport: #10192a;
  --mesh-base-trough: #10192a;
  /* Peak: lighter navy wash (previous pulse read) */
  --mesh-base-peak: #1a2e48;
  --mesh-copper-alpha: 0.08;
  --mesh-teal-alpha: 0.06;
}

@property --mesh-base {
  syntax: '<color>';
  inherits: false;
  initial-value: #10192a;
}

@property --mesh-copper-alpha {
  syntax: '<number>';
  inherits: false;
  initial-value: 0.08;
}

@property --mesh-teal-alpha {
  syntax: '<number>';
  inherits: false;
  initial-value: 0.06;
}

/* Viewport trough when canvas layers are absent (no-JS / pre-paint) */
html {
  background-color: var(--viewport, #10192a);
}

/* Let fixed canvas layers supply the viewport color */
body:has(.mesh-bg) {
  background: transparent !important;
  background-color: transparent !important;
}

main,
.wrap,
.shell {
  position: relative;
  z-index: 1;
}

/* Animated mesh/rays/grid/grain retired — viewport is now a flat, solid navy
   that matches the site header/navbar base (#10192a). The .mesh-bg layer is
   kept as a single solid fill; the rays/grid/grain layers are removed. */
.mesh-bg {
  position: fixed;
  inset: 0;
  z-index: -4;
  background: #10192a;
}

.canvas-rays,
.grid-bg,
.canvas-grain {
  display: none !important;
}

/* Full-page bands: mesh + rays show through (cards keep their own surfaces) */
.section-band,
.section-band--soft,
.section-band--base,
.section-band--glow {
  background: transparent;
}

.section-band--base::before,
.section-band--soft::before,
.section-band--glow::before {
  display: none;
}

/* Intro gate: own full-viewport backdrop (no fixed canvas bleed) */
.intro-gate,
.canvas-intro-shield {
  position: relative;
  z-index: 2;
  isolation: isolate;
}

/* Section accent logo — consistent sizing (engage, command, about, contact) */
.trace-section-logo {
  display: block;
  margin: 0 auto clamp(0.75rem, 2vw, 1rem);
  padding: 0;
  line-height: 0;
  text-align: center;
}
.trace-section-logo img {
  display: block;
  height: clamp(2rem, 4.5vw, 2.75rem);
  width: auto;
  margin-inline: auto;
  object-fit: contain;
}
#vibe-check .trace-section-logo {
  margin-top: 0;
  margin-bottom: 0;
}
.about-model > .trace-section-logo {
  margin-bottom: clamp(1rem, 2.5vw, 1.35rem);
}

/* Chrome: static overlays only — master canvas does not show through footer */
.site-footer {
  position: relative;
  z-index: 10;
  isolation: isolate;
  background-color: var(--viewport, #10192a);
}
