    .steps-timeline {
      position: relative;
      padding-left: 3rem;
    }
    .steps-timeline::before {
      content: '';
      position: absolute;
      left: 18px; top: 0; bottom: 0;
      width: 2px;
      background: linear-gradient(to bottom, var(--emerald), var(--indigo), var(--amber), transparent);
    }
    .step-item {
      position: relative;
      padding-bottom: 4rem;
    }
    .step-item:last-child { padding-bottom: 0; }
    .step-dot {
      position: absolute;
      left: -3rem;
      top: 4px;
      width: 38px; height: 38px;
      background: var(--bg);
      border: 2px solid var(--emerald);
      border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      font-size: 0.9rem;
      font-weight: 800;
      color: var(--emerald);
      z-index: 1;
      box-shadow: 0 0 15px var(--emerald-glow);
    }
    .step-number {
      font-size: 0.72rem;
      font-weight: 700;
      color: var(--emerald);
      letter-spacing: 1.5px;
      text-transform: uppercase;
      margin-bottom: 0.5rem;
    }
    .step-title {
      font-size: 1.5rem;
      font-weight: 700;
      margin-bottom: 0.8rem;
      letter-spacing: -0.02em;
    }
    .step-desc {
      font-size: 0.95rem;
      color: var(--text-mid);
      line-height: 1.8;
      max-width: 520px;
    }
    .step-tech-box {
      margin-top: 1.2rem;
      padding: 1rem;
      background: var(--surface);
      border: 1px solid var(--border);
      border-radius: var(--r-md);
      display: flex;
      gap: 12px;
      align-items: center;
    }
    .step-tech-icon {
      font-size: 1.5rem;
      opacity: 0.8;
    }
    .step-tech-text {
      font-size: 0.75rem;
      font-family: var(--font-mono);
      color: var(--text-dim);
    }

    /* Architecture Visualizer */
    .shell-viz {
      background: var(--surface);
      border: 1px solid var(--border);
      border-radius: var(--r-lg);
      padding: 3rem;
      position: relative;
      overflow: hidden;
    }
    .shell-viz::before {
      content: '';
      position: absolute;
      inset: 0;
      background: radial-gradient(circle at center, rgba(16,185,129,0.04), transparent 70%);
    }
    .shell-grid {
      display: grid;
      grid-template-columns: repeat(5, 1fr);
      gap: 1.5rem;
      position: relative;
      z-index: 1;
    }
    .shell-card {
      background: var(--bg);
      border: 1px solid var(--border);
      border-radius: var(--r-md);
      padding: 1.5rem 1rem;
      text-align: center;
      transition: all 0.3s ease;
    }
    .shell-card:hover {
      border-color: var(--emerald);
      transform: translateY(-5px);
      box-shadow: 0 10px 30px -10px var(--emerald-glow);
    }
    .shell-icon { font-size: 2rem; margin-bottom: 1rem; display: block; }
    .shell-name { font-size: 0.85rem; font-weight: 700; margin-bottom: 0.4rem; color: var(--text); }
    .shell-tech { font-size: 0.65rem; color: var(--emerald); font-family: var(--font-mono); font-weight: 600; text-transform: uppercase; }

    .faq-section { max-width: 800px; margin: 0 auto; }
    
    @media (max-width: 900px) {
      .shell-grid { grid-template-columns: 1fr 1fr; }
      .how-split { grid-template-columns: 1fr !important; }
    }
