/* v10: original full-fidelity stream styles plus targeted render fixes. */
/* Dev Fabric / lightstream v7 — thin luminous filaments, reference-matched.
   Visual-only overlay. Buttons, forms, navigation and CRM logic are unchanged. */
:root[data-brand="dev-fabric"].df-flow-v7 #content {
  position: relative;
  isolation: isolate;
  background-color: #050806;
}
:root[data-brand="dev-fabric"].df-flow-v7 #content > :not(.df-light-ribbons) {
  position: relative;
  z-index: 1;
}
:root[data-brand="dev-fabric"].df-flow-v7 #content > .df-light-ribbons {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  display: block;
  z-index: 0;
  opacity: .94;
  pointer-events: none !important;
  user-select: none;
  mix-blend-mode: screen;
}
:root[data-brand="dev-fabric"].df-flow-v7 .df-light-ribbons svg {
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
:root[data-brand="dev-fabric"].df-flow-v7 .df-light-ribbons path {
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}
:root[data-brand="dev-fabric"].df-flow-v7 .df-light-ribbons .df-v7-halo {
  filter: url(#df-v7-blur);
}
:root[data-brand="dev-fabric"].df-flow-v7 .df-light-ribbons .df-v7-strand {
  filter: drop-shadow(0 0 2.5px rgba(209,248,158,.26));
}
:root[data-brand="dev-fabric"].df-flow-v7 .df-light-ribbons .df-v7-sparkline {
  stroke-dasharray: 2 125;
  animation: df-lightstream-drift 23s linear infinite;
}
:root[data-brand="dev-fabric"].df-flow-v7 .df-light-ribbons .df-v7-flash {
  stroke: #fff8df;
  stroke-width: 2;
  opacity: .67;
  filter: drop-shadow(0 0 5px rgba(236,255,191,.85));
}
:root[data-brand="dev-fabric"].df-flow-v7 .df-light-ribbons .df-v7-spark {
  fill: #efffd0;
  opacity: .78;
  filter: drop-shadow(0 0 7px rgba(224,255,159,.9));
}
@keyframes df-lightstream-drift { to { stroke-dashoffset: -480; } }

/* The old hero image is a disconnected fragment. The new strands belong to
   the entire document instead of a fixed or repeated background. */
:root[data-brand="dev-fabric"].df-flow-v7 .df-hero {
  background: linear-gradient(90deg,
    rgba(5,8,6,.99) 0%,rgba(5,8,6,.95) 27%,
    rgba(5,8,6,.72) 46%,rgba(5,8,6,.14) 80%,
    rgba(5,8,6,.18) 100%) !important;
}
:root[data-brand="dev-fabric"].df-flow-v7 .df-approach {
  background-color: rgba(7,13,9,.68) !important;
  background-image: linear-gradient(90deg,
    rgba(6,10,7,.83),rgba(6,10,7,.61) 45%,rgba(6,10,7,.35)) !important;
}
:root[data-brand="dev-fabric"].df-flow-v7 .df-capability-band {
  background: rgba(8,13,9,.82) !important;
  backdrop-filter: blur(4px);
}

/* Glass surfaces — mild transparency only. No element-level opacity change,
   so text, icons and interactive controls remain fully legible. */
:root[data-brand="dev-fabric"].df-flow-v7 .fa-assembly-wrap::before {
  background: radial-gradient(ellipse at 59% 48%,rgba(139,216,96,.10),transparent 58%),
    linear-gradient(145deg,rgba(18,36,24,.77),rgba(6,15,10,.74) 42%,rgba(7,16,12,.73)) !important;
  -webkit-backdrop-filter: blur(4px) saturate(115%);
  backdrop-filter: blur(4px) saturate(115%);
}
:root[data-brand="dev-fabric"].df-flow-v7 .fa-module-front {
  background: linear-gradient(150deg,rgba(22,35,26,.82),rgba(7,15,11,.77)) !important;
  -webkit-backdrop-filter: blur(4px) saturate(115%);
  backdrop-filter: blur(4px) saturate(115%);
}
:root[data-brand="dev-fabric"].df-flow-v7 .fa-core .fa-cube-front {
  background: linear-gradient(150deg,rgba(34,55,39,.86),rgba(10,20,14,.83)) !important;
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
}
:root[data-brand="dev-fabric"].df-flow-v7 .df-ready-card,
:root[data-brand="dev-fabric"].df-flow-v7 .df-solution-card,
:root[data-brand="dev-fabric"].df-flow-v7 .df-service-card,
:root[data-brand="dev-fabric"].df-flow-v7 .df-landing-card,
:root[data-brand="dev-fabric"].df-flow-v7 .df-landing-nav-card,
:root[data-brand="dev-fabric"].df-flow-v7 .df-product-feature {
  background: linear-gradient(145deg,rgba(17,29,23,.79),rgba(7,16,12,.74)) !important;
  -webkit-backdrop-filter: blur(4px) saturate(113%);
  backdrop-filter: blur(4px) saturate(113%);
  border-color: rgba(192,232,167,.23) !important;
}
:root[data-brand="dev-fabric"].df-flow-v7 .contact-intro,
:root[data-brand="dev-fabric"].df-flow-v7 .surface-form {
  background: linear-gradient(150deg,rgba(18,29,25,.82),rgba(7,16,12,.78)) !important;
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
}
:root[data-brand="dev-fabric"].df-flow-v7 .df-design-teaser-previews a {
  background-color: rgba(11,19,14,.82) !important;
}
:root[data-brand="dev-fabric"].df-flow-v7 .df-offer-detail,
:root[data-brand="dev-fabric"].df-flow-v7 .df-tags span {
  background-color: rgba(14,28,19,.76) !important;
}

/* Mobile: maintain the thread bundle, soften bloom behind long headings. */
@media(max-width:720px) {
  :root[data-brand="dev-fabric"].df-flow-v7 #content > .df-light-ribbons {
    opacity: .79;
  }
  :root[data-brand="dev-fabric"].df-flow-v7 .df-hero {
    background: linear-gradient(90deg,rgba(5,8,6,.985) 0%,
      rgba(5,8,6,.94) 40%,rgba(5,8,6,.66) 69%,
      rgba(5,8,6,.35) 100%) !important;
  }
  :root[data-brand="dev-fabric"].df-flow-v7 .df-light-ribbons .df-v7-halo {
    opacity: .6;
  }
  :root[data-brand="dev-fabric"].df-flow-v7 .fa-assembly-wrap::before {
    background: linear-gradient(150deg,rgba(15,30,19,.79),rgba(6,15,10,.74)) !important;
  }
}
@media(prefers-reduced-motion:reduce) {
  :root[data-brand="dev-fabric"].df-flow-v7 .df-v7-sparkline {animation:none!important;}
  :root[data-brand="dev-fabric"].df-flow-v7 .df-v7-flash,
  :root[data-brand="dev-fabric"].df-flow-v7 .df-v7-spark {display:none!important;}
}

/* Dev Fabric v9 — stop full-document dash animation; scroll-tied highlight stays.
   The 23 ribbons, halos, colours, curvatures, transparency and clickable modules remain. */
:root[data-brand="dev-fabric"].df-flow-v7 .df-v7-sparkline{
  animation:none !important;
}
:root[data-brand="dev-fabric"].df-hero-suspended .df-hero::after,
:root[data-brand="dev-fabric"].df-hero-suspended .df-hero .fa-particle,
:root[data-brand="dev-fabric"].df-hero-suspended .df-hero .fa-module,
:root[data-brand="dev-fabric"].df-hero-suspended .df-hero .fa-circuit path,
:root[data-brand="dev-fabric"].df-tab-hidden .df-hero::after,
:root[data-brand="dev-fabric"].df-tab-hidden .df-hero .fa-particle,
:root[data-brand="dev-fabric"].df-tab-hidden .df-hero .fa-module,
:root[data-brand="dev-fabric"].df-tab-hidden .df-hero .fa-circuit path{
  animation-play-state:paused !important;
}
