/* Architectural Engineering — D3 steel frame line-art hero overrides. */
.arch-steel-hero {
  position: relative;
  isolation: isolate;
  background: #050c12;
}
.arch-steel-hero__stage {
  position: absolute;
  inset: -4% -8% -6% -8%;
  z-index: 0;
  overflow: hidden;
  touch-action: pan-y pinch-zoom;
  background: #050c12;
}
.arch-steel-hero__svg {
  display: block;
  width: 100%;
  height: 100%;
  shape-rendering: geometricPrecision;
  text-rendering: geometricPrecision;
}
.arch-steel-hero__root { transform-origin: center; }
.arch-steel-hero__member {
  transition: stroke 0.35s ease, opacity 0.35s ease;
  filter: drop-shadow(0 0 2px rgba(160, 202, 252, 0.28));
}
.arch-steel-hero__member.is-highlight { stroke: rgba(169, 210, 248, 1); opacity: 1; }
.arch-steel-hero__node { opacity: 0; pointer-events: none; }
.arch-steel-hero__node.is-pulse { opacity: 1; }
.arch-steel-hero__scrim {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(5, 12, 18, 0.96) 0%, rgba(5, 12, 18, 0.86) 32%, rgba(5, 12, 18, 0.34) 58%, rgba(5, 12, 18, 0.08) 100%),
    linear-gradient(0deg, rgba(5, 12, 18, 0.66) 0%, rgba(5, 12, 18, 0.06) 46%, rgba(5, 12, 18, 0.18) 100%);
}
.arch-steel-hero__fallback,
.arch-steel-hero__fallback img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  object-fit: cover;
}
@media (max-width: 960px) {
  .arch-steel-hero { min-height: 560px; height: auto; }
  .arch-steel-hero__stage { inset: -2% -28% -4% -20%; }
}
@media (prefers-reduced-motion: reduce) {
  .arch-steel-hero__member { stroke-dasharray: none; stroke-dashoffset: 0; }
}