@media (max-width: 900px) {
  .hero-title { font-size: clamp(52px, 12vw, 86px); }
  .hud-left { display: none; }
  .hud-right { right: 24px; bottom: 22px; }
  .tech-grid { background-size: 44px 44px; }
  .kinetic-statement { margin-top: 90px; padding-top: 34px; }
  .kinetic-statement span { font-size: 10vw; }
  .data-rail { grid-template-columns: 1fr 1fr; margin-bottom: -100px; }
}

@media (max-width: 560px) {
  .hero-title { font-size: 13vw; }
  .hud-right span:last-child { display: none; }
  .kinetic-statement span { font-size: 10.5vw; }
  .data-rail { grid-template-columns: 1fr; }
}

#webgl-accent {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  pointer-events: none;
  opacity: .92;
  mix-blend-mode: screen;
}

.hero-copy, .hero-index, .scroll, .hud { z-index: 3; }

@media (max-width: 900px) {
  #webgl-accent { opacity: .62; }
}

@media (prefers-reduced-motion: reduce) {
  #webgl-accent { opacity: .35; }
}
@media (min-width: 901px) { .nav .mobile-contact { display: none; } }

/* Give the brand a readable presence in the header on every screen. */
.nav .brand img{width:clamp(260px,25vw,320px)}
@media(max-width:900px){.nav .brand img{width:225px}}
/* The conceptual dashboard shows a visual control, not an interactive action. */
.dash-head .demo-action{background:var(--blue);color:#fff;border-radius:8px;padding:10px 13px;font-size:9px;display:inline-flex;align-items:center}