function Counseling() {
  return (
    <section className="section">
      <div className="container">
        <div className="counseling">
          <div className="counseling-grid">
            <div>
              <FadeUp>
                <div className="section-eyebrow" style={{color:'rgba(255,255,255,0.55)'}}>AI counseling</div>
              </FadeUp>
              <FadeUp delay={1}>
                <h2>Tell us your story. <span className="serif">We'll map the path.</span></h2>
              </FadeUp>
              <FadeUp delay={2}>
                <p className="counseling-sub">
                  No more guessing. Four short steps, an advisor in the loop, and a shortlist of programs ranked by fit — not commissions.
                </p>
              </FadeUp>
              <div className="counseling-steps">
                {[
                  'Share interests, background and time horizon',
                  'Receive a ranked shortlist of 3–5 programs',
                  'Compare universities, fees and outcomes',
                  'Apply with full document support',
                ].map((s, i) => (
                  <FadeUp key={i} delay={(i % 3) + 1}>
                    <div className="counseling-step">
                      <div className="counseling-step-num">0{i+1}</div>
                      <div className="counseling-step-text">{s}</div>
                    </div>
                  </FadeUp>
                ))}
              </div>
              <FadeUp>
                <button className="btn btn-primary btn-lg">Start your match <ArrowIcon/></button>
              </FadeUp>
            </div>

            <FadeUp delay={2}>
              <div className="counseling-viz">
                <div className="cv-head">
                  <div className="cv-head-title">Match engine · session #4821</div>
                  <div className="cv-head-live"><span className="dot"/>Live</div>
                </div>

                <div className="cv-q">
                  <div className="cv-q-label">Background</div>
                  <div className="cv-q-val">B.Com graduate · 1 year experience</div>
                </div>
                <div className="cv-q">
                  <div className="cv-q-label">Interests</div>
                  <div className="cv-chips">
                    <span className="cv-chip sel">Analytics</span>
                    <span className="cv-chip sel">Finance</span>
                    <span className="cv-chip">Marketing</span>
                    <span className="cv-chip">HR</span>
                    <span className="cv-chip sel">Strategy</span>
                  </div>
                </div>
                <div className="cv-q">
                  <div className="cv-q-label">Time commitment</div>
                  <div className="cv-q-val">10–12 hrs / week · evenings</div>
                </div>

                <div className="cv-rec-head">
                  <span>Top 3 matches</span>
                  <span style={{color:'var(--accent)'}}>Updated now</span>
                </div>
                <div className="cv-rec">
                  <div className="cv-rec-icon">M</div>
                  <div className="cv-rec-main">
                    <div className="cv-rec-title">MBA — Business Analytics</div>
                    <div className="cv-rec-sub">Manipal University · 24 mo · ₹1.2L/yr</div>
                  </div>
                  <div className="cv-rec-score">96%</div>
                </div>
                <div className="cv-rec">
                  <div className="cv-rec-icon">J</div>
                  <div className="cv-rec-main">
                    <div className="cv-rec-title">MBA — Finance & Fintech</div>
                    <div className="cv-rec-sub">Jain University · 24 mo · ₹98K/yr</div>
                  </div>
                  <div className="cv-rec-score">92%</div>
                </div>
                <div className="cv-rec">
                  <div className="cv-rec-icon">A</div>
                  <div className="cv-rec-main">
                    <div className="cv-rec-title">MCom — Strategic Finance</div>
                    <div className="cv-rec-sub">Amity University · 24 mo · ₹72K/yr</div>
                  </div>
                  <div className="cv-rec-score">88%</div>
                </div>
              </div>
            </FadeUp>
          </div>
        </div>
      </div>
    </section>
  );
}
window.Counseling = Counseling;
