/* ============================================================
   RUDRAA RATNA — Blog (facts-first, machine-readable)
   ============================================================ */
const RR_BLOG = [
  {
    slug: "what-is-pyrite",
    title: "What is Pyrite? Facts, uses and authenticity",
    date: "2026-06-16",
    category: "Crystals",
    summary: "Pyrite is a metallic iron-sulfide mineral, traditionally used as a prosperity and confidence symbol. Facts on properties, use and how to identify real Pyrite.",
    body: [
      { h: "What it is", p: "Pyrite is iron sulfide (FeS2), a brass-yellow metallic mineral often called Fool's Gold for its gold-like shine. It forms in cubic crystals and is used in bracelets, frames and decor." },
      { h: "Traditional associations", p: "Pyrite is traditionally associated with prosperity, willpower, focus and protection from negativity. These are belief-based associations, not guaranteed outcomes." },
      { h: "Common uses", p: "Worn as a bracelet for daily intention, or placed on a work desk, shop counter or Vastu wealth corner as a decor symbol." },
      { h: "How to identify real Pyrite", p: "Real Pyrite has a metallic lustre, noticeable weight and small cubic flecks. Painted glass or coated beads often look flat, too yellow or unusually light." },
      { h: "Care", p: "Keep away from prolonged water and harsh chemicals; wipe with a dry cloth." },
    ],
  },
  {
    slug: "what-is-citrine",
    title: "Citrine: facts, meaning and care",
    date: "2026-06-16",
    category: "Crystals",
    summary: "Citrine is a yellow-to-honey variety of quartz, traditionally chosen for confidence and positivity. Facts on identification, use and care.",
    body: [
      { h: "What it is", p: "Citrine is a yellow to amber variety of quartz (silicon dioxide). Natural Citrine shows warm honey tones with natural inclusions." },
      { h: "Traditional associations", p: "Citrine is traditionally associated with confidence, optimism, self-expression and an abundance mindset. Belief-based, not a guaranteed result." },
      { h: "Common uses", p: "Worn as a daily bracelet, especially by students, sales and public-facing workers and creators." },
      { h: "Authenticity", p: "Natural Citrine has softer, uneven honey tones. Over-bright, perfectly uniform yellow can indicate heat-treated or imitation material; ask for documentation where relevant." },
      { h: "Care", p: "Avoid prolonged sunlight, harsh chemicals and long water exposure; store separately." },
    ],
  },
  {
    slug: "what-is-amethyst",
    title: "Amethyst: facts, meaning and care",
    date: "2026-06-16",
    category: "Crystals",
    summary: "Amethyst is a violet quartz traditionally linked to calm and clarity. Facts on properties, use, authenticity and care.",
    body: [
      { h: "What it is", p: "Amethyst is the purple variety of quartz, coloured by iron and natural irradiation. It ranges from pale lilac to deep violet, often with natural colour zoning." },
      { h: "Traditional associations", p: "Amethyst is traditionally associated with calm, sleep, intuition and spiritual balance. These are belief-based associations." },
      { h: "Common uses", p: "Worn during evening routines or meditation, or kept as a tower/cluster in a home altar or workspace." },
      { h: "Authenticity", p: "Natural Amethyst often shows uneven purple zoning and internal veils. Perfectly even, glassy colour may need checking." },
      { h: "Care", p: "Avoid prolonged sunlight (can fade colour) and harsh chemicals; clean gently." },
    ],
  },
  {
    slug: "what-is-black-tourmaline",
    title: "Black Tourmaline: facts and traditional use",
    date: "2026-06-16",
    category: "Crystals",
    summary: "Black Tourmaline is an opaque mineral traditionally used for grounding and protection. Facts on properties, use and authenticity.",
    body: [
      { h: "What it is", p: "Black Tourmaline (schorl) is a boron silicate mineral, opaque black with subtle vertical striations on the surface." },
      { h: "Traditional associations", p: "It is traditionally associated with grounding, energetic protection and shielding from negativity and the evil eye (nazar). Belief-based, not medical." },
      { h: "Common uses", p: "Worn daily on the wrist, or kept near an entrance or workspace as a protective symbol." },
      { h: "Authenticity", p: "Genuine Black Tourmaline is opaque with natural striations and weight, not glossy plastic or uniformly dyed stone." },
      { h: "Care", p: "Wipe clean and store separately to avoid scratches; cleanse per personal practice." },
    ],
  },
  {
    slug: "5-mukhi-rudraksha-facts",
    title: "5 Mukhi Rudraksha: facts and care",
    date: "2026-06-16",
    category: "Rudraksha",
    summary: "The 5 Mukhi (five-faced) Rudraksha is the most common and widely worn bead. Facts on what it is, wearing and authenticity.",
    body: [
      { h: "What it is", p: "Rudraksha are the seeds of the Elaeocarpus ganitrus tree. The 5 Mukhi bead has five natural faces (mukhis) and is the most widely available and worn type." },
      { h: "Traditional associations", p: "The 5 Mukhi is traditionally associated with calm, focus and daily spiritual practice, and is considered suitable for most people. Belief-based, not a medical or fixed-result claim." },
      { h: "How it is worn", p: "Worn as a single bead pendant or a mala. Traditionally dipped in cow's ghee or milk before first wear; a mantra such as Om Namah Shivaya may be chanted." },
      { h: "Authenticity", p: "A natural bead shows clearly defined faces (mukhis) and natural pores. For higher-mukhi or rare beads, confirm certificate/documentation before purchase." },
      { h: "Care", p: "Keep clean and dry; oil occasionally; avoid harsh chemicals." },
    ],
  },
];

function BlogPage(){
  const { go } = useContext(Nav);
  return (
    <main>
      <Breadcrumb items={[{label:'Home',page:'home'},{label:'Blog'}]}/>
      <section className="section tight"><div className="wrap">
        <Reveal className="section-head"><span className="eyebrow no-rule">Blog</span><h1 className="h1" style={{marginTop:10}}>Crystal &amp; Rudraksha facts</h1><p>Short, factual guides on stones, Rudraksha and care. Traditional associations are described as belief and tradition, not guaranteed results.</p></Reveal>
        <div className="blog-grid mt8">
          {RR_BLOG.map((post,i)=>(
            <Reveal key={post.slug} className="blog-card card" delay={Math.min(i*0.05,0.25)}>
              <button onClick={()=>go('blog-post',{slug:post.slug})}>
                <span className="blog-card__cat">{post.category}</span>
                <h2 className="h3">{post.title}</h2>
                <p>{post.summary}</p>
                <span className="link-underline">Read <Icon name="chevR" size={14}/></span>
              </button>
            </Reveal>
          ))}
        </div>
      </div></section>
      <TrustDisclaimer/>
    </main>
  );
}

function BlogPostPage({ params={} }){
  const { go } = useContext(Nav);
  const post = RR_BLOG.find(p=>p.slug===(params||{}).slug);
  if(!post){
    return (
      <main className="pdp"><section className="section"><div className="wrap"><Reveal className="section-head center">
        <span className="eyebrow no-rule">Blog</span><h1 className="h1" style={{marginTop:10}}>Article not found</h1>
        <div className="center mt6"><button className="btn btn-maroon btn-lg" onClick={()=>go('blog')}>Back to blog <Icon name="arrow" size={17}/></button></div>
      </Reveal></div></section></main>
    );
  }
  return (
    <main className="pdp">
      <Breadcrumb items={[{label:'Home',page:'home'},{label:'Blog',page:'blog'},{label:post.title}]}/>
      <section className="section tight"><div className="wrap policy-doc">
        <Reveal className="section-head"><span className="eyebrow no-rule">{post.category}</span><h1 className="h1" style={{marginTop:10}}>{post.title}</h1><p className="muted" style={{marginTop:6}}>{post.date}</p></Reveal>
        <div className="policy-doc__body mt6">
          <p className="lead">{post.summary}</p>
          {post.body.map((s,i)=>(
            <Reveal key={i} className="policy-block"><h2 className="h3">{s.h}</h2><p>{s.p}</p></Reveal>
          ))}
        </div>
        <div className="mt8"><a className="btn btn-wa btn-lg" href={RR.wa("Hi Rudraa Ratna, I read your blog on "+post.title+" and have a question.")} target="_blank" rel="noopener"><WaGlyph/> Ask on WhatsApp</a></div>
      </div></section>
      <TrustDisclaimer/>
    </main>
  );
}

Object.assign(window, { RR_BLOG, BlogPage, BlogPostPage });