.testimonials,
.contact {
  position: relative;
  isolation: isolate;
}

.testimonials > :not(.tech-ambient),
.contact > :not(.tech-ambient) {
  position: relative;
  z-index: 1;
}

.tech-ambient {
  --tech-play-state: paused;
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  contain: paint;
  pointer-events: none;
  background: #0b0d0f;
}

.tech-ambient.is-running {
  --tech-play-state: running;
}

.testimonials > .tech-ambient,
.contact > .tech-ambient {
  position: absolute;
  z-index: 0;
}

.testimonials > .tech-ambient,
.contact > .tech-ambient {
  position: absolute;
  z-index: 0;
}

.tech-plane,
.tech-plane > img,
.tech-overlay {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.tech-plane > img {
  object-fit: cover;
  object-position: right center;
  filter: brightness(.66) saturate(.7);
}

.tech-overlay {
  z-index: 2;
  opacity: 0;
  mix-blend-mode: screen;
  transition: opacity .9s ease;
}

.tech-ambient.is-image-ready .tech-overlay {
  opacity: .7;
}

.tech-ambient::after {
  position: absolute;
  inset: 0;
  z-index: 1;
  content: "";
  background: linear-gradient(90deg, rgba(7, 9, 11, .92), rgba(7, 9, 11, .76) 42%, rgba(7, 9, 11, .3));
}

.tech-led,
.tech-key,
.tech-meter,
.tech-screen-trace,
.tech-screen-scan {
  animation-play-state: var(--tech-play-state);
}

.tech-led {
  fill: #a7dc91;
  opacity: .12;
  filter: drop-shadow(0 0 3px rgba(167, 220, 145, .5));
  animation: tech-link-burst var(--tech-period, 4.2s) linear infinite var(--tech-delay, 0s);
  animation-play-state: var(--tech-play-state);
}

.tech-led--amber {
  fill: #d9aa60;
  filter: drop-shadow(0 0 3px rgba(217, 170, 96, .5));
}

.tech-led--online {
  animation-name: tech-online-breathe;
  animation-timing-function: ease-in-out;
}

.tech-led--red {
  fill: #ed2024;
  opacity: .12;
  filter: drop-shadow(0 0 3px rgba(237, 32, 36, .5));
  animation-name: tech-red-breathe;
  animation-duration: var(--tech-period, 4.8s);
  animation-timing-function: ease-in-out;
}

.tech-key {
  fill: #8ad1b7;
  opacity: .12;
  animation: tech-program-key var(--tech-period, 6s) ease-in-out infinite var(--tech-delay, 0s);
  animation-play-state: var(--tech-play-state);
}

.tech-key--program {
  fill: #ed2024;
}

.tech-meter {
  fill: #98c79a;
  opacity: .1;
  animation: tech-meter-level var(--tech-period, 2.3s) ease-in-out infinite var(--tech-delay, 0s);
  animation-play-state: var(--tech-play-state);
}

.tech-meter--peak {
  fill: #d7b06a;
}

.tech-screen-grid {
  fill: none;
  stroke: #82acb8;
  stroke-width: 1;
  opacity: .09;
}

.tech-screen-trace {
  fill: none;
  stroke: #9cc6cf;
  stroke-width: 1.8;
  stroke-linecap: round;
  opacity: .36;
  stroke-dasharray: 760;
  animation: tech-signal-trace 7s ease-in-out infinite;
  animation-play-state: var(--tech-play-state);
}

.tech-screen-trace--secondary {
  stroke: #a8bf97;
  opacity: .2;
  animation-delay: -3.5s;
}

.tech-screen-scan {
  fill: #acc6ce;
  opacity: 0;
  animation: tech-screen-refresh 8s linear infinite;
  animation-play-state: var(--tech-play-state);
}

.signal-flow {
  min-height: 164px;
  padding: 40px 28px;
  overflow: hidden;
  isolation: isolate;
  background: #101214;
  border-top: 1px solid rgba(237, 32, 36, .55);
}

.signal-flow .signal-flow-line {
  z-index: 1;
  background: rgba(255, 255, 255, .18);
}

.signal-flow .signal-node {
  z-index: 2;
  color: #f3f4f4;
}

.signal-flow .signal-node > span {
  color: #f06b6d;
  background: #15181a;
  border-color: rgba(255, 255, 255, .26);
}

.tech-ambient--network .tech-plane > img {
  object-position: right top;
  filter: brightness(.54) saturate(.5);
}

.tech-ambient--network::after {
  background: linear-gradient(90deg, rgba(7, 9, 11, .86), rgba(7, 9, 11, .62) 58%, rgba(7, 9, 11, .36));
}

.tech-ambient--signal {
  background: #0b1012;
}

.tech-ambient--signal::after {
  z-index: 3;
  background: linear-gradient(180deg, transparent 20%, rgba(9, 13, 15, .88) 44%, rgba(9, 13, 15, .88) 59%, transparent 84%);
}

.signal-topology {
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.signal-topology--tall {
  display: none;
}

.topology-chassis {
  fill: #111b20;
  stroke: #71868d;
  stroke-width: 1;
  stroke-opacity: .42;
}

.topology-screw {
  fill: #667a80;
  opacity: .35;
}

.topology-backplane {
  stroke: #56727b;
  stroke-width: .7;
  opacity: .16;
}

.topology-track {
  stroke: #6d9d9a;
  stroke-width: 1;
  opacity: .26;
}

.topology-packet {
  stroke: #a0d9cb;
  stroke-width: 2;
  stroke-dasharray: 50 950;
  stroke-dashoffset: 1000;
  opacity: 0;
  animation: topology-route 8s cubic-bezier(.3, 0, .3, 1) infinite var(--signal-delay, 0s);
  animation-play-state: var(--tech-play-state);
}

.topology-wave {
  stroke: #94c4cb;
  stroke-width: 1.3;
  opacity: .55;
}

.topology-meter {
  fill: #8ec4ab;
  opacity: .48;
  transform-box: fill-box;
  transform-origin: center bottom;
  animation: topology-level 2.8s ease-in-out infinite var(--signal-delay, 0s);
  animation-play-state: var(--tech-play-state);
}

.topology-meter--peak {
  fill: #c6ab76;
}

.topology-port-outline,
.topology-screen {
  stroke: #709499;
  stroke-width: .8;
  stroke-opacity: .48;
}

.topology-port {
  stroke: #8ec4ab;
  stroke-width: 1.5;
  opacity: .18;
  animation: topology-port-activity 5.6s linear infinite var(--signal-delay, 0s);
  animation-play-state: var(--tech-play-state);
}

.topology-fader-track,
.topology-output-bars {
  stroke: #718d94;
  stroke-width: 1;
  opacity: .48;
}

.topology-fader {
  fill: #a6babd;
  opacity: .56;
}

.topology-cue {
  fill: #86bbae;
  opacity: .14;
  animation: topology-cue 8s ease-in-out infinite var(--signal-delay, 0s);
  animation-play-state: var(--tech-play-state);
}

.topology-cue--program {
  fill: #ed5c5f;
}

.topology-screen-grid {
  stroke: #76959e;
  stroke-width: .6;
  opacity: .13;
}

.topology-frame {
  stroke: #a0d9cb;
  stroke-width: 1;
  opacity: .48;
  animation: topology-capture 8s ease-out infinite;
  animation-play-state: var(--tech-play-state);
}

.topology-raster {
  stroke: #aac8ce;
  stroke-width: 1;
  opacity: 0;
  animation: topology-display 8s linear infinite;
  animation-play-state: var(--tech-play-state);
}

.topology-tally {
  fill: #f04a4e;
  opacity: 0;
  animation: topology-live 8s ease-in-out infinite;
  animation-play-state: var(--tech-play-state);
}

.topology-live {
  fill: #f04a4e;
  font-family: "DM Sans", Arial, sans-serif;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0;
  opacity: 0;
  animation: topology-live 8s ease-in-out infinite;
  animation-play-state: var(--tech-play-state);
}

.testimonials .quote-card {
  background: rgba(15, 17, 19, .82);
}

.tech-ambient--console::after {
  background:
    linear-gradient(90deg, rgba(7, 9, 11, .91), rgba(7, 9, 11, .76) 42%, rgba(7, 9, 11, .25)),
    linear-gradient(180deg, rgba(7, 9, 11, .25), transparent 56%, rgba(7, 9, 11, .38));
}

.tech-ambient--comms .tech-plane > img {
  filter: brightness(.48) saturate(.5);
}

.tech-ambient--comms::after {
  background: linear-gradient(110deg, rgba(140, 6, 12, .91), rgba(86, 9, 15, .76) 40%, rgba(10, 12, 14, .32));
}

.tech-ambient.is-document-hidden,
body.lightbox-open .tech-ambient,
body.menu-open .tech-ambient {
  --tech-play-state: paused;
}

@keyframes tech-link-burst {
  0%, 18%, 38%, 67%, 100% { opacity: .08; }
  21%, 25% { opacity: .9; }
  42%, 47% { opacity: .55; }
  74%, 79% { opacity: .78; }
}

@keyframes tech-online-breathe {
  0%, 100% { opacity: .2; }
  45% { opacity: .62; }
  72% { opacity: .34; }
}

@keyframes tech-program-key {
  0%, 18%, 100% { opacity: .08; }
  28%, 58% { opacity: .62; }
  73% { opacity: .2; }
}

@keyframes tech-meter-level {
  0%, 100% { opacity: .1; }
  18% { opacity: .64; }
  42% { opacity: .24; }
  63% { opacity: .78; }
  82% { opacity: .2; }
}

@keyframes tech-signal-trace {
  0% { stroke-dashoffset: 760; }
  48%, 76% { stroke-dashoffset: 0; }
  100% { stroke-dashoffset: -760; }
}

@keyframes tech-screen-refresh {
  0%, 15% { opacity: 0; transform: translateY(0); }
  22%, 74% { opacity: .07; }
  86%, 100% { opacity: 0; transform: translateY(300px); }
}

@keyframes topology-route {
  0% { opacity: 0; stroke-dashoffset: 1000; }
  3% { opacity: .8; }
  23% { opacity: .8; stroke-dashoffset: 0; }
  25%, 100% { opacity: 0; stroke-dashoffset: -50; }
}

@keyframes topology-level {
  0%, 100% { transform: scaleY(.36); opacity: .28; }
  22% { transform: scaleY(.78); opacity: .56; }
  45% { transform: scaleY(.48); opacity: .4; }
  67% { transform: scaleY(1); opacity: .7; }
  84% { transform: scaleY(.58); opacity: .44; }
}

@keyframes topology-port-activity {
  0%, 28%, 43%, 74%, 100% { opacity: .18; }
  31%, 37% { opacity: .78; }
  79%, 85% { opacity: .5; }
}

@keyframes topology-cue {
  0%, 18%, 82%, 100% { opacity: .14; }
  35%, 61% { opacity: .55; }
}

@keyframes topology-display {
  0%, 72% { opacity: 0; transform: translateY(0); }
  77%, 92% { opacity: .38; }
  97%, 100% { opacity: 0; transform: translateY(26px); }
}

/* Final route: 4s delay + 23% of 8s = 73% of the shared cycle. */
@keyframes topology-live {
  0%, 73%, 100% { opacity: 0; }
  77%, 91% { opacity: 1; }
  84% { opacity: .28; }
}

@keyframes topology-capture {
  0%, 71%, 79%, 100% { opacity: .48; }
  73%, 75% { opacity: 1; }
}

@media (max-width: 680px) {
  .signal-flow {
    min-height: 276px;
    padding: 28px;
    gap: 18px;
  }

  .signal-flow .signal-flow-line {
    top: 42px;
    bottom: 42px;
    left: 45px;
  }

  .tech-ambient--console::after {
    background: linear-gradient(90deg, rgba(7, 9, 11, .87), rgba(7, 9, 11, .62));
  }

  .tech-ambient.is-image-ready .tech-overlay {
    opacity: .5;
  }

  .signal-topology--wide {
    display: none;
  }

  .signal-topology--tall {
    display: block;
  }

  .tech-ambient--signal::after {
    background: linear-gradient(90deg, rgba(9, 13, 15, .9) 48%, rgba(9, 13, 15, .36) 67%, transparent 82%);
  }
}

@media (prefers-reduced-motion: reduce) {
  .tech-overlay {
    transition: none;
  }

  .tech-led,
  .tech-key,
  .tech-meter,
  .tech-screen-trace,
  .tech-screen-scan,
  .topology-packet,
  .topology-meter,
  .topology-port,
  .topology-cue,
  .topology-raster,
  .topology-tally,
  .topology-live,
  .topology-frame {
    animation: none !important;
    opacity: .24;
  }

  .topology-live,
  .topology-tally {
    opacity: .68;
  }

  .tech-screen-scan,
  .topology-packet,
  .topology-raster {
    display: none;
  }
}

/* V1 keeps its existing section layouts; these overrides tune only the new ambience. */
.tech-ambient--signal.is-image-ready .tech-overlay {
  opacity: .92;
}

.capabilities-backdrop.tech-ambient::before,
.testimonials-ambience.tech-ambient::before {
  display: none;
}

/* The global section rule gives every direct child a stacking position. Keep
   this ambient layer out of normal flow so its full-bleed image can render. */
main > section.capabilities > .capabilities-backdrop.tech-ambient {
  position: absolute;
  inset: 0;
  z-index: 0;
  height: 100%;
}

.tech-ambient--photo .tech-plane {
  z-index: 2;
}

.capabilities-backdrop.tech-ambient .tech-plane > img {
  object-position: center 50%;
  opacity: 1;
  filter: brightness(.9) saturate(.9) contrast(1.06);
}

.tech-ambient--rack::after {
  background:
    linear-gradient(90deg, rgba(7, 9, 11, .46), rgba(7, 9, 11, .3) 48%, rgba(7, 9, 11, .2)),
    linear-gradient(180deg, rgba(7, 9, 11, .16), transparent 46%, rgba(7, 9, 11, .32));
}

.tech-ambient--rack.is-image-ready .tech-overlay {
  opacity: .78;
}

.capabilities-backdrop.tech-ambient--rack .tech-plane::after,
.testimonials-ambience.tech-ambient--rack .tech-plane::after {
  opacity: .36;
}

.testimonials-ambience.tech-ambient .tech-plane > img {
  object-position: right center;
  opacity: .82;
  filter: brightness(.84) saturate(.84) contrast(1.06);
}

.testimonials-ambience.tech-ambient::after {
  background:
    linear-gradient(90deg, rgba(7, 9, 11, .62), rgba(7, 9, 11, .44) 55%, rgba(7, 9, 11, .2)),
    linear-gradient(180deg, rgba(7, 9, 11, .2), rgba(7, 9, 11, .08) 48%, rgba(7, 9, 11, .3));
}

.testimonials-ambience.tech-ambient.is-image-ready .tech-overlay {
  opacity: .72;
}

.testimonials .quote-card {
  background: rgba(10, 12, 14, .96);
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
}

.testimonials-ambience.tech-ambient .tech-plane > img,
.testimonials-ambience.tech-ambient .tech-plane::before,
.testimonials-ambience.tech-ambient .tech-plane::after {
  animation-play-state: var(--tech-play-state);
}

.testimonials > :not(.tech-ambient) {
  z-index: 3;
}

.capability-card {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .055), rgba(255, 255, 255, .015)),
    rgba(12, 14, 17, .62);
  -webkit-backdrop-filter: blur(3px);
  backdrop-filter: blur(3px);
}

.capability-card::after {
  background:
    linear-gradient(180deg, rgba(17, 17, 19, .02) 0%, rgba(17, 17, 19, .08) 38%, rgba(17, 17, 19, .66) 100%),
    linear-gradient(120deg, rgba(237, 32, 36, .12), transparent 42%);
  opacity: .72;
}

.capability-card:hover,
.capability-card.reveal.is-visible.is-focused {
  background:
    linear-gradient(180deg, rgba(237, 32, 36, .16), rgba(255, 255, 255, .02)),
    rgba(17, 19, 22, .72);
}

.capability-card:hover::after,
.capability-card.reveal.is-visible.is-focused::after {
  opacity: .68;
}

.capability-media {
  opacity: .4;
  clip-path: inset(0);
}

.capability-media img {
  filter: brightness(.92) saturate(.9) contrast(1.04);
}

.tech-led {
  opacity: .2;
  filter: drop-shadow(0 0 5px rgba(167, 220, 145, .82));
}

.tech-led--amber {
  filter: drop-shadow(0 0 6px rgba(255, 174, 89, .86));
}

.tech-led--red {
  opacity: .2;
  filter: drop-shadow(0 0 5px rgba(237, 32, 36, .78));
}

.tech-key {
  opacity: .2;
  filter: drop-shadow(0 0 5px rgba(138, 209, 183, .74));
}

.tech-meter {
  opacity: .2;
  filter: drop-shadow(0 0 5px rgba(152, 199, 154, .7));
}

.tech-screen-grid {
  opacity: .16;
}

.tech-screen-trace {
  opacity: .68;
  filter: drop-shadow(0 0 3px rgba(156, 198, 207, .48));
}

.tech-screen-trace--secondary {
  opacity: .4;
}

.tech-ambient--signal::after {
  background: linear-gradient(180deg, rgba(9, 13, 15, .1) 0%, rgba(9, 13, 15, .3) 44%, rgba(9, 13, 15, .3) 59%, rgba(9, 13, 15, .1) 100%);
}

.topology-chassis {
  fill: #21323a;
  stroke: #c1e1e7;
  stroke-opacity: .78;
}

.topology-backplane {
  opacity: .42;
}

.topology-track {
  opacity: .62;
}

.topology-wave {
  opacity: .78;
  filter: drop-shadow(0 0 4px rgba(148, 196, 203, .44));
}

.topology-meter {
  opacity: .64;
  filter: drop-shadow(0 0 5px rgba(152, 199, 154, .72));
}

.topology-port-outline,
.topology-screen {
  stroke-opacity: .68;
}

.topology-port {
  opacity: .52;
  filter: drop-shadow(0 0 4px rgba(142, 196, 171, .66));
}

.topology-cue {
  opacity: .42;
  filter: drop-shadow(0 0 4px rgba(134, 187, 174, .5));
}

.topology-cue--program {
  filter: drop-shadow(0 0 5px rgba(237, 92, 95, .72));
}

.topology-frame {
  opacity: .72;
  filter: drop-shadow(0 0 4px rgba(160, 217, 203, .5));
}

.topology-screen-grid {
  opacity: .24;
}

.tech-ambient--rack .tech-plane::after,
.tech-ambient--console .tech-plane::after {
  position: absolute;
  z-index: 3;
  top: -16%;
  bottom: -16%;
  left: -28%;
  width: 25%;
  content: "";
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(93, 205, 243, .2), rgba(224, 246, 255, .36), rgba(237, 32, 36, .12), transparent);
  filter: blur(11px);
  mix-blend-mode: screen;
  opacity: .9;
  transform: skewX(-16deg);
  animation: tech-equipment-sweep 17s cubic-bezier(.35, 0, .2, 1) infinite;
  animation-play-state: var(--tech-play-state);
}

.tech-ambient--console .tech-plane::after {
  animation-delay: -8s;
}

.tech-ambient--photo .tech-plane > img {
  transform: scale(1.04);
  animation: tech-scene-drift 28s ease-in-out infinite alternate;
  animation-play-state: var(--tech-play-state);
}

.tech-ambient--photo .tech-plane::before {
  position: absolute;
  z-index: 2;
  inset: 0;
  content: "";
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(5, 7, 9, .38), rgba(5, 7, 9, .12) 40%, rgba(5, 7, 9, 0) 78%),
    linear-gradient(180deg, rgba(5, 7, 9, .05), transparent 42%, rgba(5, 7, 9, .2)),
    radial-gradient(ellipse at 72% 38%, rgba(46, 178, 226, .28), transparent 32%),
    radial-gradient(ellipse at 84% 66%, rgba(237, 32, 36, .17), transparent 27%),
    radial-gradient(ellipse at 91% 45%, rgba(91, 224, 194, .2), transparent 20%);
  opacity: .76;
  animation: tech-status-glow 8.5s ease-in-out infinite;
  animation-play-state: var(--tech-play-state);
}

.tech-ambient--console.tech-ambient--photo .tech-plane::before {
  background:
    linear-gradient(90deg, rgba(5, 7, 9, .24), rgba(5, 7, 9, .08) 38%, rgba(5, 7, 9, 0) 76%),
    linear-gradient(180deg, rgba(5, 7, 9, .08), transparent 46%, rgba(5, 7, 9, .16)),
    radial-gradient(ellipse at 76% 36%, rgba(60, 190, 240, .27), transparent 31%),
    radial-gradient(ellipse at 87% 63%, rgba(237, 32, 36, .18), transparent 30%),
    radial-gradient(ellipse at 60% 53%, rgba(91, 224, 194, .18), transparent 27%);
}

@keyframes tech-scene-drift {
  from { transform: scale(1.04) translate3d(0, 0, 0); }
  to { transform: scale(1.11) translate3d(-.8%, -.8%, 0); }
}

@keyframes tech-status-glow {
  0%, 100% { opacity: .54; }
  43% { opacity: .88; }
  71% { opacity: .64; }
}

@keyframes tech-equipment-sweep {
  0%, 8% { transform: translateX(0) skewX(-16deg); opacity: 0; }
  15% { opacity: .9; }
  35% { transform: translateX(650%) skewX(-16deg); opacity: .82; }
  43%, 100% { transform: translateX(650%) skewX(-16deg); opacity: 0; }
}

@media (max-width: 680px) {
  .capability-card {
    background:
      linear-gradient(180deg, rgba(255, 255, 255, .04), rgba(255, 255, 255, .01)),
      rgba(12, 14, 17, .68);
  }

  .tech-ambient--photo .tech-plane::before {
    background:
      linear-gradient(90deg, rgba(5, 7, 9, .22), rgba(5, 7, 9, .08) 60%, transparent),
      linear-gradient(180deg, rgba(5, 7, 9, .12), transparent 44%, rgba(5, 7, 9, .28)),
      radial-gradient(ellipse at 72% 38%, rgba(46, 178, 226, .24), transparent 32%),
      radial-gradient(ellipse at 84% 66%, rgba(237, 32, 36, .14), transparent 27%);
  }

}

@media (prefers-reduced-motion: reduce) {
  .tech-ambient--photo .tech-plane > img,
  .tech-ambient--photo .tech-plane::before,
  .testimonials-ambience.tech-ambient .tech-plane > img,
  .testimonials-ambience.tech-ambient .tech-plane::before,
  .testimonials-ambience.tech-ambient .tech-plane::after,
  .tech-ambient--rack .tech-plane::after,
  .tech-ambient--console .tech-plane::after {
    animation: none !important;
  }
}

@keyframes tech-link-burst {
  0%, 18%, 38%, 67%, 100% { opacity: .14; }
  21%, 25% { opacity: 1; }
  42%, 47% { opacity: .72; }
  74%, 79% { opacity: .94; }
}

@keyframes tech-online-breathe {
  0%, 100% { opacity: .28; }
  45% { opacity: .84; }
  72% { opacity: .48; }
}

@keyframes tech-red-breathe {
  0%, 67%, 100% { opacity: .16; }
  72%, 76% { opacity: .76; }
  83% { opacity: .2; }
}

@keyframes tech-program-key {
  0%, 18%, 100% { opacity: .14; }
  28%, 58% { opacity: .84; }
  73% { opacity: .32; }
}

@keyframes tech-meter-level {
  0%, 100% { opacity: .18; }
  18% { opacity: .78; }
  42% { opacity: .34; }
  63% { opacity: .92; }
  82% { opacity: .3; }
}