/* Four project milestones, separate from everyday AI service areas. */
#approach .scene-inner { padding-top:105px;padding-bottom:185px; }
#approach .heading-row { gap:48px;margin-top:18px; }
#approach .heading-row h2 { font-size:48px;line-height:1.08;font-weight:510;letter-spacing:-.045em; }
#approach .heading-row > p { max-width:290px;font-size:16px;line-height:1.7;color:#b7c0cd; }
#approach .ref-automation { margin:28px 0 0;background:var(--noe-bg);border:1px solid var(--noe-line);border-radius:8px;overflow:hidden;padding:12px 20px; }
#approach .ref-automation-stage { width:100%;max-width:none;margin:auto; }
#approach .ref-automation-map { display:block;width:100%;height:auto;overflow:visible; }
#approach .ref-auto-wires path { stroke:#43505f;stroke-width:1; }
#approach .ref-auto-moving-lines path { stroke:var(--noe-accent);stroke-width:2;stroke-dasharray:70 930;opacity:.55;animation:implementationFlow 12s linear infinite;animation-play-state:paused; }
#approach .ref-auto-node-border { stroke:var(--noe-accent);stroke-width:1;stroke-opacity:.2;animation:implementationMilestone 12s ease-in-out infinite;animation-delay:var(--milestone-delay);animation-play-state:paused; }
#approach .ref-auto-node-body { fill:var(--noe-surface);stroke:#35414e;stroke-width:1; }
#approach .ref-auto-glyph { color:#c9d1dc;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round; }
#approach.is-current .ref-auto-moving-lines path,#approach.is-current .ref-auto-node-border { animation-play-state:running; }
.scene-deck.is-transitioning #approach .ref-auto-moving-lines path,.scene-deck.is-transitioning #approach .ref-auto-node-border { animation-play-state:paused; }
#approach .ref-approach-steps { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px;margin-top:24px; }
#approach .ref-approach-steps article { display:grid;grid-template-columns:23px minmax(0,1fr);gap:8px 9px;align-items:baseline;align-content:start; }
#approach .ref-approach-number { font-family:"SF Mono",Menlo,Consolas,monospace;font-size:12px;color:var(--noe-accent);line-height:24px;letter-spacing:0; }
#approach .ref-approach-steps h3 { margin:0;color:var(--noe-text);font-size:22px;font-weight:550;letter-spacing:-.02em;line-height:1.35; }
#approach .ref-approach-steps p { grid-column:2;margin:0;color:var(--noe-muted);font-size:15px;line-height:1.6; }
@keyframes implementationFlow { 0% { stroke-dashoffset:1000;opacity:0; } 8%,85% { opacity:.6; } 100% { stroke-dashoffset:0;opacity:0; } }
@keyframes implementationMilestone { 0%,28%,100% { stroke-opacity:.2; } 5%,20% { stroke-opacity:1; } }
@media (min-width:981px) and (max-width:1180px) {
  #approach .ref-approach-steps { gap:20px; }
  #approach .ref-approach-steps h3 { font-size:19px; }
  html[lang=en] #approach .ref-approach-steps h3 { min-height:52px; }
}
@media (min-width:981px) and (max-height:800px) {
  #approach .ref-automation { padding:0 20px; }
  #approach .ref-approach-steps { margin-top:20px;gap:22px; }
  #approach .ref-approach-steps h3 { font-size:20px; }
  #approach .ref-approach-steps p { font-size:14px; }
}
@media (max-width:980px) {
  #approach .ref-automation { padding:12px; }
  #approach .ref-approach-steps { gap:16px; }
  #approach .ref-approach-steps h3 { font-size:18px; }
  #approach .ref-approach-steps p { font-size:14px; }
}
@media (max-width:700px) {
  #approach .ref-approach-steps { grid-template-columns:repeat(2,minmax(0,1fr));gap:20px; }
}
@media (prefers-reduced-motion:reduce) {
  #approach .ref-auto-moving-lines path { animation:none;opacity:0; }
  #approach .ref-auto-node-border { animation:none;stroke-opacity:.4; }
}