/* goodwork. Living Company Brain + Commandbase widget. Pair with company-brain-widget.js. */
.cbw { background: #000; overflow-x: auto; overflow-y: hidden; }
.cbw-svg { display: block; width: 100%; height: auto; margin: 0 auto; overflow: visible; }

/* Path draw-in animation (delays set inline by the script) */
@keyframes drawPath {
  to { stroke-dashoffset: 0; }
}
.d-line {
  stroke-dasharray: 600;
  stroke-dashoffset: 600;
  animation: drawPath 1.2s cubic-bezier(0.4,0,0.2,1) forwards;
}

/* ─── LIVE BRAIN DIAGRAM ─── */
.dg-col { font-size: 9px; font-weight: 600; letter-spacing: 0.1em; fill: rgba(255,255,255,0.22); }
.dg-label { font-size: 11.5px; letter-spacing: -0.2px; fill: rgba(255,255,255,0.48); transition: fill 0.9s ease; }
.dg-label.lit { fill: #fff; transition: fill 0.12s ease; }
.dg-label.lit-p { fill: #c4b5fd; transition: fill 0.12s ease; }
.dg-end { fill: rgba(255,255,255,0.22); transition: fill 0.9s ease; }
.dg-end.lit { fill: #fff; transition: fill 0.12s ease; }
.dg-end.lit-p { fill: #a78bfa; transition: fill 0.12s ease; }

/* breathing glow + slow orbit rings (from the brand AI orb) */
.dg-breathe { animation: dgBreathe 6s ease-in-out infinite; }
@keyframes dgBreathe { 0%,100% { opacity: 0.55; } 50% { opacity: 0.95; } }
.dg-orbit { transform-origin: 550px 490px; animation: dgSpin 70s linear infinite; }
.dg-orbit--2 { animation-duration: 110s; animation-direction: reverse; }
@keyframes dgSpin { to { transform: rotate(360deg); } }

/* one-shot rings: radar from the brain, ripples at endpoints */
.dg-ripple { transform-box: fill-box; transform-origin: center; animation: dgRipple 1.1s ease-out forwards; }
.dg-radar  { transform-box: fill-box; transform-origin: center; animation: dgRadar 2.4s ease-out forwards; }
@keyframes dgRipple { from { transform: scale(1); opacity: 0.9; } to { transform: scale(5); opacity: 0; } }
@keyframes dgRadar  { from { transform: scale(0.55); opacity: 0.55; } to { transform: scale(1.5); opacity: 0; } }

/* drifting dust */
.dg-dust { animation: dgDrift var(--d) linear infinite; animation-delay: var(--delay); opacity: 0; }
@keyframes dgDrift {
  0%   { transform: translate(0,0); opacity: 0; }
  20%  { opacity: var(--o); }
  80%  { opacity: var(--o); }
  100% { transform: translate(var(--dx), -70px); opacity: 0; }
}

/* commandbase laptop */
.dg-caret { animation: dgBlink 1.06s steps(1) infinite; }
@keyframes dgBlink { 0%,50% { opacity: 1; } 50.01%,100% { opacity: 0; } }
.dg-live { animation: dgLive 1.8s ease-in-out infinite; }
@keyframes dgLive { 0%,100% { opacity: 1; } 50% { opacity: 0.35; } }
.dg-send { transition: opacity 0.3s ease; }
.dg-typing circle { animation: dgDot 1.1s ease-in-out infinite; }
.dg-typing circle:nth-child(2) { animation-delay: 0.15s; }
.dg-typing circle:nth-child(3) { animation-delay: 0.3s; }
@keyframes dgDot { 0%,60%,100% { opacity: 0.25; } 30% { opacity: 1; } }
.dg-fade { transition: opacity 0.5s ease; }

@media (prefers-reduced-motion: reduce) {
  .dg-breathe, .dg-orbit, .dg-caret, .dg-live, .dg-dust, .dg-typing circle { animation: none; }
  .d-line { animation: none; stroke-dashoffset: 0; }
}