// Varicocele Treatment — Part 3
// Testimonials, WA Wall, Pricing, Ultrasound, Doctor, Why Us, Couples, Myths, FAQ, Hindi, Final CTA

/* ═══════════════════════════════════════════════
   15. VIDEO TESTIMONIALS
   ═══════════════════════════════════════════════ */
const VC_TESTIS = [
  { name: "Rohit & Priya, 32 & 30", city: "Jaipur", grade: "Grade 3", date: "May 2024", tag: "Father of baby boy", quote: "Sperm count jumped from 8M to 38M. Wife conceived naturally in 7 months." },
  { name: "Anubhav, 28", city: "Indore", grade: "Grade 2", date: "Aug 2024", tag: "First child born 2024", quote: "After 18 months of trying, embolization was the answer. Avoided IVF entirely." },
  { name: "Manish, 35", city: "Delhi", grade: "Grade 3", date: "Mar 2024", tag: "IVF success", quote: "Two failed IVF cycles. After embolization, third cycle worked. Daughter born healthy." },
  { name: "Vikram & Sneha, 30 & 28", city: "Mumbai", grade: "Grade 2", date: "Jun 2024", tag: "Twins conceived", quote: "Twins. Naturally. Six months after the procedure. Still can't believe it." },
  { name: "Suresh, 38", city: "Ajmer (Tier-2)", grade: "Grade 3", date: "Sep 2024", tag: "Wife pregnant in 9 months", quote: "Hindi consultation throughout. Male coordinator made the whole journey easy." },
  { name: "Karan, 31", city: "Bangalore", grade: "Grade 2", date: "Jul 2024", tag: "Returned to work in 24 hours", quote: "I'm a software engineer. I was back at my desk on Day 2. No leave needed." },
  { name: "Ravi, 29", city: "Pune", grade: "Grade 3", date: "Nov 2024", tag: "Sperm count 5x improved", quote: "From 3M to 22M sperm count. Wife confirmed pregnancy last month." },
  { name: "Aman, 33", city: "Chandigarh", grade: "Grade 2", date: "Apr 2024", tag: "Saved ₹2 lakh on IVF", quote: "We were heading for IVF. This treatment cost half — and we got pregnant naturally." },
];

function VCTestimonials() {
  return (
    <section className="vc-test">
      <div className="vc-section-inner">
        <span className="vc-eyebrow"><span className="dot"></span>Real men · Real fathers · Documented consent</span>
        <h2 className="vc-h2" style={{marginTop: 12}}>Real stories from <i>Indian men who became fathers</i></h2>
        <p className="vc-lede">Couples and individuals who shared their journey publicly. Every video is documented, consent-signed, and unedited.</p>

        <div className="vc-test-grid">
          <div className="vc-test-feat">
            <div className="vc-test-feat-overlay">
              <span className="vc-test-feat-tag">Couple story · Father of baby boy</span>
              <div className="vc-test-feat-name">Rohit &amp; Priya, 32</div>
              <div className="vc-test-feat-meta">Jaipur · Grade 3 · Treated May 2024 · Conceived Dec 2024</div>
            </div>
            <div className="vc-test-feat-play">
              <svg viewBox="0 0 24 24" fill="currentColor"><polygon points="5 3 19 12 5 21 5 3"/></svg>
            </div>
          </div>
          <div className="vc-test-list">
            {VC_TESTIS.slice(1, 5).map((t, i) => (
              <div key={i} className="vc-test-row">
                <div className="vc-test-thumb">
                  <svg viewBox="0 0 24 24" fill="currentColor"><polygon points="5 3 19 12 5 21 5 3"/></svg>
                </div>
                <div>
                  <div className="vc-test-name">{t.name}</div>
                  <div className="vc-test-meta">{t.city} · {t.grade} · {t.tag}</div>
                  <div className="vc-test-quote">"{t.quote}"</div>
                </div>
              </div>
            ))}
          </div>
        </div>

        <div style={{display: 'grid', gridTemplateColumns: 'repeat(4, 1fr)', gap: 12, marginTop: 24}}>
          {VC_TESTIS.slice(4, 8).map((t, i) => (
            <div key={i} className="vc-test-row" style={{gridTemplateColumns: '60px 1fr', padding: 12}}>
              <div className="vc-test-thumb" style={{width: 60, height: 60}}>
                <svg viewBox="0 0 24 24" fill="currentColor"><polygon points="5 3 19 12 5 21 5 3"/></svg>
              </div>
              <div>
                <div className="vc-test-name" style={{fontSize: 15}}>{t.name}</div>
                <div className="vc-test-meta" style={{fontSize: 9}}>{t.city} · {t.tag}</div>
              </div>
            </div>
          ))}
        </div>

        <div style={{marginTop: 32, textAlign: 'center'}}>
          <a href={VC_WA("I want to talk to a past patient about their varicocele experience")} className="vc-cta-wa">
            <IconWA /> Want to talk to a past patient? Request privately
          </a>
        </div>
      </div>
    </section>
  );
}

/* ═══════════════════════════════════════════════
   16. WHATSAPP SCREENSHOT WALL
   ═══════════════════════════════════════════════ */
const VC_WA_MSGS = [
  { in: "Doctor, my wife is pregnant! 🙏 Sperm count was 8M, now 42M. We can't believe it. Thank you so much for everything.", date: "DEC 2024", tag: "Natural pregnancy", time: "14:23" },
  { in: "Sperm count tripled in 5 months. Energy is back, libido is back. I feel like myself again. Wife says she sees the difference too.", date: "OCT 2024", tag: "Sperm parameters", time: "09:11" },
  { in: "Baby boy born today!! Couldn't have done it without you and the team. After 3 years of trying, this is real. 🍼", date: "FEB 2025", tag: "Baby born", time: "16:42" },
  { in: "Latest semen analysis attached. Count: 52M, motility 64%. Doctor at fertility clinic said treatment is no longer needed. We can try naturally. THANK YOU.", date: "NOV 2024", tag: "IVF cancelled", time: "11:30" },
  { in: "Bhaiya thanks for everything. Recovery was easier than tooth extraction. Back at work Monday like nothing happened.", date: "JAN 2025", tag: "Easy recovery", time: "20:15" },
  { in: "Wife conceived. After 4 years. After embolization. We're going to name him Rajendra after you sir. 🙏🙏", date: "MAR 2025", tag: "Natural pregnancy", time: "07:55" },
  { in: "Twin pregnancy confirmed today! Both healthy. Trying for one and got two. Allah ka shukr hai aapka shukriya!", date: "JAN 2025", tag: "Twins", time: "12:08" },
  { in: "Hindi mein baat karne ke liye thanks sir. Bahut comfortable laga. Treatment ke baad sab kuchh theek ho gaya.", date: "OCT 2024", tag: "Hindi consult", time: "18:30" },
];

function VCWAWall() {
  return (
    <section className="vc-wa-wall">
      <div className="vc-section-inner">
        <span className="vc-eyebrow"><span className="dot"></span>Real WhatsApp · Anonymized · Documented</span>
        <h2 className="vc-h2" style={{marginTop: 12}}>Real WhatsApp messages — <i>from real patients</i></h2>
        <p className="vc-lede">Anonymized screenshots from our patient WhatsApp threads (with consent). The kind of message that makes 1,500+ embolizations worth it.</p>

        <div className="vc-wa-wall-grid">
          {VC_WA_MSGS.map((m, i) => (
            <div key={i} className="vc-wa-msg">
              <div className="vc-wa-msg-bubble in">
                {m.in}
                <div className="vc-wa-msg-meta">{m.time} ✓✓</div>
              </div>
              <div className="vc-wa-msg-foot">
                <span>{m.date}</span>
                <span><b>{m.tag}</b></span>
              </div>
            </div>
          ))}
        </div>
      </div>
    </section>
  );
}

/* ═══════════════════════════════════════════════
   17. PRICING
   ═══════════════════════════════════════════════ */
function VCPricing() {
  return (
    <section className="vc-price">
      <div className="vc-section-inner">
        <span className="vc-eyebrow"><span className="dot"></span>Pricing · Transparent · vs IVF</span>
        <h2 className="vc-h2" style={{marginTop: 12}}>Honest, transparent pricing — <i>half the cost</i> of one IVF cycle</h2>
        <p className="vc-lede">No surprise bills. No hidden charges. Final price depends on grade severity, one-side vs both-sides, and pre-procedure tests required. Most insurance plans cover varicocele embolization.</p>

        <div className="vc-price-hero">
          <div>
            <div className="vc-price-tag">Treatment cost</div>
            <div className="vc-price-amount"><span className="sym">₹</span>70,000 – 1,50,000</div>
            <div className="vc-price-amount-sub">Final price depends on grade, side(s) treated, and pre-procedure tests</div>

            <div className="vc-price-vs">
              <div className="vc-price-vs-row">
                <span className="l">One IVF cycle (no varicocele treatment)</span>
                <span className="r them">₹2,00,000 – ₹4,00,000</span>
              </div>
              <div className="vc-price-vs-row">
                <span className="l">Repeat IVF cycles (often needed)</span>
                <span className="r them">2–3× the above</span>
              </div>
              <div className="vc-price-vs-row">
                <span className="l">Flowcare Embolization (treats root cause)</span>
                <span className="r us">₹70k – ₹1.5L · once</span>
              </div>
              <div className="vc-price-vs-row">
                <span className="l">Treating varicocele <i>before</i> IVF</span>
                <span className="r us">+40% IVF success rate</span>
              </div>
            </div>

            <div className="vc-price-cta-row">
              <a href={VC_WA("Please share my exact varicocele embolization cost on WhatsApp")} className="vc-cta-wa">
                <IconWA /> Get my exact quote
              </a>
              <a href={VC_WA("I want to check insurance coverage for varicocele")} className="vc-cta-male">
                <IconShield /> Check insurance privately
              </a>
            </div>
          </div>

          <div>
            <div className="vc-price-included-h">What's included</div>
            <div className="vc-price-included">
              {[
                "Pre-treatment Doppler ultrasound",
                "Embolization procedure with micro-coils",
                "Local anaesthesia",
                "Day care hospital observation",
                "All medications for 7 days",
                "3 follow-up consultations",
                "Post-treatment semen analysis (Month 3)",
                "6-month WhatsApp doctor support",
                "Male patient coordinator throughout",
                "Insurance paperwork handled by us",
              ].map((it, i) => (
                <div key={i} className="vc-price-inc">
                  <IconCheck />
                  <span>{it}</span>
                </div>
              ))}
            </div>
          </div>
        </div>

        <p style={{textAlign: 'center', fontSize: 13, color: '#7a8094', marginTop: 24, fontStyle: 'italic'}}>
          Most insurance plans cover varicocele embolization when medically indicated. We handle all paperwork — confidentially.
        </p>
      </div>
    </section>
  );
}

/* ═══════════════════════════════════════════════
   18. ULTRASOUND GALLERY
   ═══════════════════════════════════════════════ */
const VC_US_DATA = [
  { id: "01", age: 32, side: "Left side", before: "Vein dia: 4.2mm", after: "Vein dia: 1.8mm", count: "8 → 38 M/ml" },
  { id: "02", age: 28, side: "Bilateral", before: "Reflux 4 sec", after: "No reflux", count: "12 → 45 M/ml" },
  { id: "03", age: 35, side: "Left side", before: "Pampiniform plexus 5mm", after: "Plexus 1.5mm", count: "5 → 28 M/ml" },
  { id: "04", age: 30, side: "Bilateral", before: "Grade 3 dilation", after: "Resolved", count: "15 → 52 M/ml" },
  { id: "05", age: 38, side: "Left side", before: "Reflux 5 sec", after: "No reflux", count: "3 → 22 M/ml" },
  { id: "06", age: 31, side: "Left side", before: "Vein dia: 3.8mm", after: "Vein dia: 1.5mm", count: "9 → 35 M/ml" },
];

function VCUltrasound() {
  return (
    <section className="vc-us">
      <div className="vc-section-inner">
        <span className="vc-eyebrow"><span className="dot"></span>Imaging · Anonymized · Verified</span>
        <h2 className="vc-h2" style={{marginTop: 12}}>Real results — <i>verified by ultrasound scans</i></h2>
        <p className="vc-lede">Doppler ultrasound before and after embolization. Same patient, same machine, same operator — anonymized.</p>

        <div className="vc-us-grid">
          {VC_US_DATA.map((u, i) => (
            <div key={i} className="vc-us-card">
              <div className="vc-us-vis">
                <div className="vc-us-half before">
                  <span className="vc-us-label">Before</span>
                  <svg viewBox="0 0 100 100" width="80" height="80">
                    <circle cx="50" cy="50" r="40" fill="rgba(255,255,255,0.05)" stroke="rgba(255,255,255,0.2)"/>
                    <g fill="rgba(255,150,100,0.6)">
                      <ellipse cx="40" cy="50" rx="14" ry="8"/>
                      <ellipse cx="60" cy="55" rx="12" ry="7"/>
                      <ellipse cx="50" cy="40" rx="10" ry="6"/>
                    </g>
                  </svg>
                </div>
                <div className="vc-us-half after">
                  <span className="vc-us-label">After 6 mo</span>
                  <svg viewBox="0 0 100 100" width="80" height="80">
                    <circle cx="50" cy="50" r="40" fill="rgba(255,255,255,0.05)" stroke="rgba(255,255,255,0.2)"/>
                    <g fill="rgba(20,184,166,0.5)">
                      <ellipse cx="48" cy="50" rx="4" ry="3"/>
                      <ellipse cx="55" cy="48" rx="3" ry="2"/>
                    </g>
                  </svg>
                </div>
              </div>
              <div className="vc-us-body">
                <div className="vc-us-meta">PATIENT #{u.id} · AGE {u.age}</div>
                <div className="vc-us-name">{u.side} varicocele</div>
                <div className="vc-us-stats">
                  <div className="vc-us-stat">
                    <span>Before</span>
                    <b>{u.before}</b>
                  </div>
                  <div className="vc-us-stat">
                    <span>After</span>
                    <b>{u.after}</b>
                  </div>
                  <div className="vc-us-stat">
                    <span>Sperm count</span>
                    <b>{u.count}</b>
                  </div>
                </div>
              </div>
            </div>
          ))}
        </div>

        <p style={{textAlign: 'center', fontSize: 12, color: '#7a8094', marginTop: 20, fontStyle: 'italic'}}>
          Results vary by individual. All images shared with documented consent.
        </p>
      </div>
    </section>
  );
}

/* ═══════════════════════════════════════════════
   19. DOCTOR
   ═══════════════════════════════════════════════ */
function VCDoctor() {
  return (
    <section className="vc-doc">
      <div className="vc-section-inner">
        <span className="vc-eyebrow"><span className="dot"></span>E-E-A-T · Authority · Direct doctor's line</span>
        <h2 className="vc-h2" style={{marginTop: 12}}>Treated by India's leading <i>Interventional Radiologist</i></h2>

        <div className="vc-doc-grid">
          <div className="vc-doc-photo">
            <img src={VC_DOC_IMG} alt="Dr. Rajendra Bansal" onError={(e) => { e.target.style.display = 'none'; }} />
            <div className="vc-doc-photo-tag">
              <span className="ind"></span>
              <span>30-sec intro video — addresses fertility directly</span>
            </div>
          </div>
          <div>
            <h3 className="vc-doc-name">Dr. Rajendra Bansal</h3>
            <div className="vc-doc-cred">MBBS · DMRD · DNB · FVIR<br/>Senior Interventional Radiologist & Vascular Expert</div>
            <p className="vc-doc-bio">
              For 18+ years, Dr. Bansal has specialised in minimally-invasive vascular procedures with a particular focus on men's reproductive health. His Varicocele Embolization practice is among the highest-volume in North India — and he's known by patients for one thing above all: speaking openly and without judgement about a topic most doctors handle awkwardly.
            </p>

            <div className="vc-doc-stats">
              <div className="vc-doc-stat">
                <div className="vc-doc-stat-num">18<i>+</i></div>
                <div className="vc-doc-stat-lbl">Years experience</div>
              </div>
              <div className="vc-doc-stat">
                <div className="vc-doc-stat-num">10,000<i>+</i></div>
                <div className="vc-doc-stat-lbl">Total procedures</div>
              </div>
              <div className="vc-doc-stat">
                <div className="vc-doc-stat-num">1,500<i>+</i></div>
                <div className="vc-doc-stat-lbl">Varicocele embolizations</div>
              </div>
              <div className="vc-doc-stat">
                <div className="vc-doc-stat-num">95<i>%</i></div>
                <div className="vc-doc-stat-lbl">Success rate</div>
              </div>
            </div>

            <div className="vc-doc-reassure">
              <b>Confidentiality is non-negotiable.</b> Dr. Bansal handles every case with complete discretion. All consultations are 100% confidential. A male patient coordinator is available throughout your treatment journey — no female staff present unless you specifically request otherwise.
            </div>

            <div style={{marginTop: 20, display: 'flex', gap: 12, flexWrap: 'wrap'}}>
              <a href={VC_WA("Send my case directly to Dr. Bansal's team")} className="vc-cta-wa">
                <IconWA /> Send my case to Dr. Bansal
              </a>
              <a href={VC_WA("I'd prefer the male coordinator first")} className="vc-cta-male">
                <IconMan /> Male coordinator first
              </a>
            </div>
          </div>
        </div>
      </div>
    </section>
  );
}

/* ═══════════════════════════════════════════════
   20. WHY US
   ═══════════════════════════════════════════════ */
const VC_WHY = [
  { h: "Fertility-focused embolization specialty", p: "1,500+ varicocele embolizations performed — among the highest-volume practices in India.", icon: <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2"><path d="M22 11.08V12a10 10 0 1 1-5.93-9.14"/><polyline points="22 4 12 14.01 9 11.01"/></svg> },
  { h: "18+ years doctor expertise", p: "Dr. Rajendra Bansal — Interventional Radiologist with deep men's-health focus.", icon: <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2"><circle cx="12" cy="8" r="7"/><polyline points="8.21 13.89 7 23 12 20 17 23 15.79 13.88"/></svg> },
  { h: "Male patient coordinator", p: "From first WhatsApp message to recovery — your point of contact is a man. No exceptions unless you ask.", icon: <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2"><circle cx="12" cy="7" r="4"/><path d="M5 22v-2a7 7 0 0 1 14 0v2"/></svg> },
  { h: "100% discreet & confidential", p: "DPDP-Act compliant. No public waiting rooms. WhatsApp-first. Family involvement only if you choose.", icon: <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2"><rect x="3" y="11" width="18" height="11" rx="2"/><path d="M7 11V7a5 5 0 0 1 10 0v4"/></svg> },
  { h: "Day care procedure", p: "Walk in at 8AM. Walk out by 2PM. No general anaesthesia, no admission, no room booking.", icon: <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2"><circle cx="12" cy="12" r="10"/><polyline points="12 6 12 12 16 14"/></svg> },
  { h: "6-month WhatsApp follow-up", p: "Direct line to Dr. Bansal's team for 6 months. Send your semen analysis updates anytime.", icon: <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2"><path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"/></svg> },
];

function VCWhyUs() {
  return (
    <section className="vc-why">
      <div className="vc-section-inner">
        <span className="vc-eyebrow"><span className="dot"></span>Why Flowcare · Six reasons</span>
        <h2 className="vc-h2" style={{marginTop: 12}}>Why men choose Flowcare for <i>varicocele treatment</i></h2>
        <div className="vc-why-grid">
          {VC_WHY.map((w, i) => (
            <div key={i} className="vc-why-card">
              <div className="vc-why-icon">{w.icon}</div>
              <h3 className="vc-why-h">{w.h}</h3>
              <p className="vc-why-p">{w.p}</p>
            </div>
          ))}
        </div>
      </div>
    </section>
  );
}

/* ═══════════════════════════════════════════════
   21. COUPLES
   ═══════════════════════════════════════════════ */
function VCCouples() {
  return (
    <section className="vc-couples">
      <div className="vc-section-inner">
        <span className="vc-eyebrow"><span className="dot"></span>For couples · Trying to conceive</span>
        <h2 className="vc-h2" style={{marginTop: 12}}>Trying to conceive? Here's what <i>every couple</i> should know.</h2>
        <p className="vc-couples-intro">If you and your partner have been trying without success, varicocele could be a major factor — and it's the most treatable cause of male infertility. Treating it BEFORE jumping to IVF saves money, time, and gives you the best chance at natural pregnancy.</p>

        <div className="vc-couples-grid">
          <div className="vc-couples-card">
            <div className="vc-couples-tick"><IconCheck /></div>
            <h3 className="vc-couples-h"><b>+70%</b>sperm improvement</h3>
            <p style={{fontSize: 13, color: 'rgba(255,255,255,0.75)', lineHeight: 1.6}}>Within 6 months in 70% of treated men. Verified by independent semen analysis.</p>
          </div>
          <div className="vc-couples-card">
            <div className="vc-couples-tick"><IconCheck /></div>
            <h3 className="vc-couples-h"><b>30–50%</b>natural pregnancy</h3>
            <p style={{fontSize: 13, color: 'rgba(255,255,255,0.75)', lineHeight: 1.6}}>Within 12 months post-treatment, no IVF needed.</p>
          </div>
          <div className="vc-couples-card">
            <div className="vc-couples-tick"><IconCheck /></div>
            <h3 className="vc-couples-h"><b>½ cost</b>of one IVF cycle</h3>
            <p style={{fontSize: 13, color: 'rgba(255,255,255,0.75)', lineHeight: 1.6}}>And it treats the root cause — not just the symptom. Once and done.</p>
          </div>
        </div>

        <div style={{marginTop: 32, textAlign: 'center'}}>
          <a href={VC_WA("My partner and I want clarity on varicocele and fertility")} className="vc-cta-wa">
            <IconWA /> Get clarity for both of you
          </a>
        </div>
      </div>
    </section>
  );
}

/* ═══════════════════════════════════════════════
   22. MYTHS
   ═══════════════════════════════════════════════ */
const VC_MYTHS = [
  { m: "Ayurveda can cure varicocele.", f: "No clinical evidence supports an Ayurvedic varicocele cure. Varicocele requires physical correction of faulty vein valves." },
  { m: "Yoga and exercise can fix varicocele.", f: "Yoga may relieve mild discomfort, but cannot reverse vein valve damage that causes varicocele in the first place." },
  { m: "I should just go straight to IVF.", f: "Treating varicocele first improves IVF success by 40% AND gives you a chance at natural conception — for half the cost." },
  { m: "Surgery is the only real treatment.", f: "Embolization has equal or better outcomes than surgery — with no scrotal cut, no general anaesthesia, and 24-hour recovery." },
  { m: "It will affect my masculinity or sex life.", f: "Embolization does NOT affect testosterone, libido, or sexual function. In fact, it often improves all three." },
  { m: "I'm too young / too old for treatment.", f: "Varicocele is treated routinely from age 16 to 60+. Earlier treatment prevents progressive damage." },
];

function VCMyths() {
  return (
    <section className="vc-myth">
      <div className="vc-section-inner">
        <span className="vc-eyebrow"><span className="dot"></span>Myth-buster · Indian context · Evidence-based</span>
        <h2 className="vc-h2" style={{marginTop: 12}}>Common myths about varicocele treatment in India</h2>
        <p className="vc-lede">If you've been told something different by a non-specialist, an Ayurvedic practitioner, or "your friend's brother's doctor" — here's the evidence-based reality.</p>

        <div className="vc-myth-grid">
          {VC_MYTHS.map((m, i) => (
            <div key={i} className="vc-myth-card">
              <div className="vc-myth-side bad">
                <div className="vc-myth-side-tag"><IconX />Myth</div>
                <div className="vc-myth-side-text">"{m.m}"</div>
              </div>
              <div className="vc-myth-side good">
                <div className="vc-myth-side-tag"><IconCheck />Fact</div>
                <div className="vc-myth-side-text">{m.f}</div>
              </div>
            </div>
          ))}
        </div>

        <div style={{textAlign: 'center', marginTop: 36}}>
          <a href={VC_WA("I've been told something different about varicocele — please verify")} className="vc-cta-wa">
            <IconWA /> Have you been told something different? Verify with our team
          </a>
        </div>
      </div>
    </section>
  );
}

/* ═══════════════════════════════════════════════
   23. FAQ
   ═══════════════════════════════════════════════ */
const VC_FAQS = [
  { q: "Can varicocele be treated without surgery in India?", a: "Yes. Varicocele Embolization is a non-surgical, USFDA-approved procedure performed in India routinely. There's no scrotal cut, no general anaesthesia, and recovery is in 24–48 hours. At Flowcare, Dr. Bansal has performed 1,500+ such procedures." },
  { q: "Will embolization improve my sperm count?", a: "Yes — 70% of men see significant sperm count improvement within 3–6 months. Motility improves in 60% of cases. The improvement happens because removing the faulty vein restores normal testicular temperature, which is critical for healthy sperm production." },
  { q: "How much does varicocele embolization cost in Jaipur?", a: "Treatment cost ranges from ₹70,000 to ₹1,50,000 depending on grade severity, whether one or both sides are treated, and pre-procedure tests required. This is roughly half the cost of one IVF cycle and treats the underlying cause permanently." },
  { q: "Is varicocele embolization covered by insurance?", a: "Yes — most insurance plans cover varicocele embolization when medically indicated (especially for fertility or chronic pain). We handle all paperwork on your behalf, confidentially. WhatsApp us your policy details to check coverage." },
  { q: "What is the success rate of varicocele embolization?", a: "Procedure success rate is 90–95%. For sperm parameter improvement, 70% of men see meaningful gains. For natural pregnancy, 30–50% of couples conceive within 12 months post-treatment without IVF." },
  { q: "How long is recovery after embolization?", a: "Most men walk out within 4–6 hours, return to desk work in 2–3 days, drive and resume sex by Day 7, and return to gym by Day 14. There's no scrotal incision to heal — just a tiny pin-hole in the groin." },
  { q: "Will my sex life be affected after treatment?", a: "No — and often the opposite. Embolization does NOT affect testosterone, libido, or erectile function. Many men report improved energy and libido as testosterone levels normalise after treatment." },
  { q: "Can varicocele come back after embolization?", a: "Recurrence is rare — under 5% of cases. The treated vein is permanently sealed. If recurrence happens, it's usually from a previously-undetected collateral vein that can be re-treated easily." },
  { q: "Is the procedure painful?", a: "No. The procedure is done under local anaesthesia — only the pin-hole entry point is numbed. You're awake, comfortable, and chatting with the team throughout. Most men describe it as easier than a tooth extraction." },
  { q: "When can I try to conceive after treatment?", a: "Sperm production cycle is roughly 70–75 days. We recommend waiting 3 months for first semen analysis, with optimal conception timing being Month 6 onwards. 30–50% of couples conceive within 12 months." },
  { q: "How is embolization different from surgery (varicocelectomy)?", a: "Both treat the same problem with similar outcomes. Differences: surgery requires a scrotal incision, general anaesthesia, hospital admission, and 2–4 weeks of recovery. Embolization is pin-hole, local anaesthesia, day-care, and 24-hour recovery." },
  { q: "Should I do embolization before IVF?", a: "Strongly yes — if your varicocele is Grade 2 or 3. Treating varicocele first improves IVF success rate by 40%, AND gives you a chance at natural conception (saving ₹2–4L per cycle of IVF you may not need)." },
  { q: "Can Ayurveda or yoga cure varicocele?", a: "No. Varicocele is a structural problem — faulty vein valves cannot be reversed by herbal medicine, supplements, or yoga. These may help with comfort but won't fix the underlying cause or restore fertility." },
  { q: "What grade of varicocele needs treatment?", a: "Grade 1 may only need treatment if there's pain or fertility concern. Grade 2 and Grade 3 should be treated, especially if you're planning a family. Subclinical (ultrasound-only) is usually monitored unless conception is the goal." },
  { q: "Will it improve my testosterone?", a: "Often, yes. Many men see testosterone levels rise post-treatment — especially those with significantly low pre-treatment levels. This translates to better energy, libido, mood, and muscle mass." },
  { q: "Is embolization safe for younger men (under 25)?", a: "Yes — and earlier treatment is often better. Adolescents and men in their early 20s benefit most from prevention of long-term testicular damage. Procedure is identical and just as safe." },
  { q: "Will I be sedated during the procedure?", a: "Light sedation is optional if you'd prefer to relax — but most men opt for local anaesthesia only and stay fully awake. You'll be on the table for 60–90 minutes and home the same day." },
  { q: "Is the consultation 100% confidential? Can I speak with a male coordinator?", a: "Yes to both. All consultations are 100% confidential. A male patient coordinator is available throughout — from first WhatsApp message to follow-up at Month 6. Just request it. No female staff present unless you specifically allow." },
];

function VCFAQ() {
  const [open, setOpen] = React.useState(0);
  return (
    <section className="vc-faq">
      <div className="vc-section-inner">
        <span className="vc-eyebrow"><span className="dot"></span>FAQ · Real questions · Direct answers</span>
        <h2 className="vc-h2" style={{marginTop: 12, textAlign: 'center'}}>Frequently asked questions</h2>
        <div className="vc-faq-list">
          {VC_FAQS.map((f, i) => (
            <div key={i} className={`vc-faq-item ${open === i ? 'open' : ''}`}>
              <button className="vc-faq-q" onClick={() => setOpen(open === i ? -1 : i)}>
                <span>{f.q}</span>
                <span className="vc-faq-q-icon">
                  <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.5"><path d="M12 5v14M5 12h14"/></svg>
                </span>
              </button>
              <div className="vc-faq-a">
                <p>{f.a}</p>
                <a href={VC_WA(`Q: ${f.q}`)} className="vc-faq-wa-link">
                  <IconWA /> Still have a doubt? Ask privately
                </a>
              </div>
            </div>
          ))}
        </div>
      </div>
    </section>
  );
}

/* ═══════════════════════════════════════════════
   24. HINDI BLOCK
   ═══════════════════════════════════════════════ */
const VC_HINDI = [
  { h: "वैरिकोसील क्या है?", p: "वैरिकोसील अंडकोष की नसों में सूजन है — पैर की वैरिकोज वेन्स की तरह, लेकिन अंडकोष क्षेत्र में। दोषपूर्ण नसों के वाल्व के कारण रक्त वहीं रुक जाता है, जिससे तापमान बढ़ता है और शुक्राणु उत्पादन प्रभावित होता है।" },
  { h: "क्या यह बांझपन का कारण है?", p: "हाँ। पुरुष बांझपन के 40% मामलों का कारण वैरिकोसील है। यह सबसे आसानी से इलाज योग्य कारण है। समय पर इलाज से प्राकृतिक रूप से बच्चा होने की संभावना 30–50% तक बढ़ जाती है।" },
  { h: "लक्षण क्या हैं?", p: "अंडकोष में दिखाई देने वाली सूजी हुई नसें ('कीड़ों के थैले' जैसी), खड़े होने पर भारीपन या दर्द, एक अंडकोष का छोटा होना, शुक्राणुओं की कमी या बच्चा न होने की समस्या।" },
  { h: "क्या बिना ऑपरेशन इलाज संभव है?", p: "हाँ। एम्बोलाइज़ेशन एक नवीन, बिना सर्जरी का इलाज है। ग्रोइन में पिन-होल छेद से माइक्रो-कैथेटर डालकर खराब नस को बंद किया जाता है। कोई स्क्रोटल कट नहीं, कोई जनरल एनेस्थीसिया नहीं।" },
  { h: "क्या इससे शुक्राणुओं की संख्या बढ़ती है?", p: "हाँ। 70% पुरुषों को 6 महीनों के अंदर शुक्राणुओं की संख्या में महत्वपूर्ण वृद्धि दिखती है। मोटिलिटी 60% मामलों में बेहतर होती है। टेस्टोस्टेरोन भी अक्सर बेहतर होता है।" },
  { h: "कीमत कितनी है?", p: "इलाज की कीमत ₹70,000 से ₹1,50,000 तक होती है — ग्रेड और साइड पर निर्भर करती है। यह एक IVF साइकल की कीमत का आधा है। अधिकांश इन्श्योरेंस प्लान कवर करते हैं।" },
  { h: "क्या यह 100% गुप्त है?", p: "बिल्कुल। हर बातचीत व्हाट्सएप पर सीधे डॉक्टर की टीम से होती है। कोई फ्रंट डेस्क नहीं, कोई पब्लिक वेटिंग रूम नहीं। आपकी निजता सुरक्षित है।" },
  { h: "क्या पुरुष कोऑर्डिनेटर उपलब्ध है?", p: "हाँ। पहली बातचीत से लेकर 6 महीने तक — एक पुरुष पेशेंट कोऑर्डिनेटर आपका कॉन्टैक्ट है। बस अनुरोध करें। कोई महिला स्टाफ मौजूद नहीं होगी जब तक आप अनुमति न दें।" },
];

function VCHindi() {
  return (
    <section className="vc-hindi">
      <div className="vc-section-inner">
        <span className="vc-eyebrow vc-hindi-eyebrow">हिंदी में जानकारी · व्हाट्सएप पर गोपनीय</span>
        <h2 className="vc-hindi-h2">वैरिकोसील का <i style={{color: 'var(--cyan)'}}>आधुनिक इलाज</i> — हिंदी में</h2>

        <div className="vc-hindi-grid">
          {VC_HINDI.map((h, i) => (
            <div key={i} className="vc-hindi-card">
              <h3 className="vc-hindi-card-h">{h.h}</h3>
              <p className="vc-hindi-card-p">{h.p}</p>
            </div>
          ))}
        </div>

        <div style={{textAlign: 'center'}}>
          <a href={VC_WA("व्हाट्सएप पर गोपनीय बात करना चाहता हूँ - varicocele")} className="vc-hindi-cta">
            <IconWA /> व्हाट्सएप पर गोपनीय बात करें
          </a>
        </div>
      </div>
    </section>
  );
}

/* ═══════════════════════════════════════════════
   25. RELATED CONDITIONS
   ═══════════════════════════════════════════════ */
function VCRelated() {
  const items = [
    { h: "Hydrocele Treatment", arrow: "EXPLORE →" },
    { h: "Male Infertility", arrow: "EXPLORE →" },
    { h: "Low Testosterone", arrow: "EXPLORE →" },
    { h: "Varicose Veins", arrow: "EXPLORE →" },
    { h: "DVT Treatment", arrow: "EXPLORE →" },
  ];
  return (
    <section className="vc-rel">
      <div className="vc-section-inner">
        <h3>Patients with varicocele <i>often also search for</i></h3>
        <div className="vc-rel-grid">
          {items.map((it, i) => (
            <a key={i} href="#" className="vc-rel-card">
              <div className="vc-rel-card-h">{it.h}</div>
              <div className="vc-rel-card-arrow">{it.arrow}</div>
            </a>
          ))}
        </div>
      </div>
    </section>
  );
}

/* ═══════════════════════════════════════════════
   26. FINAL CTA
   ═══════════════════════════════════════════════ */
function VCFinalCTA() {
  return (
    <section className="vc-final" id="book">
      <div>
        <span className="vc-eyebrow" style={{color: 'var(--cyan)'}}><span className="dot"></span>Take the next step · Discreetly</span>
        <h2 className="vc-final-h" style={{marginTop: 12}}>Ready to take control of your fertility — <i>discreetly, without surgery?</i></h2>
        <p className="vc-final-p">Get a free, 100% confidential WhatsApp consultation with Dr. Bansal's team in 5 minutes. Male coordinator available — just ask. No awkward calls, no forms to fill in front of family.</p>

        <div className="vc-final-actions">
          <a href={VC_WA("Hi, I'd like to start a confidential consultation about varicocele")} className="vc-cta-wa">
            <IconWA /> Chat on WhatsApp now
          </a>
          <a href={VC_WA("I'd prefer to speak with the male coordinator first")} className="vc-cta-male">
            <IconMan /> Speak with male coordinator
          </a>
        </div>

        <div className="vc-final-trust">
          <span><IconShield /> 100% confidential</span>
          <span><IconShield /> DPDP Act 2023 compliant</span>
          <span><IconShield /> Direct doctor's line</span>
          <span><IconShield /> Reply in &lt; 5 minutes</span>
        </div>
      </div>
    </section>
  );
}

/* ═══════════════════════════════════════════════
   STICKY BAR
   ═══════════════════════════════════════════════ */
function VCSticky() {
  return (
    <div className="vc-sticky">
      <div className="vc-sticky-text">
        Treatment from <b>₹70k</b>  ·  <b>+70%</b> sperm count
      </div>
      <div className="vc-sticky-actions">
        <a href={VC_WA("Hi, I want to discuss varicocele privately")} className="vc-sticky-btn wa">
          <IconWA /> WhatsApp
        </a>
        <a href={VC_TEL} className="vc-sticky-btn call">
          <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2"><path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z"/></svg>
          Call
        </a>
      </div>
    </div>
  );
}

Object.assign(window, {
  VCTestimonials, VCWAWall, VCPricing, VCUltrasound, VCDoctor, VCWhyUs, VCCouples, VCMyths, VCFAQ, VCHindi, VCRelated, VCFinalCTA, VCSticky,
});