/* Build Core Supply — Website UI Kit · inner pages + detailed data */
const { useState: uS3, useEffect: uE3 } = React;

/* ===================== DETAIL DATA ===================== */
/* Service detail — expanded copy for each of the 6 services */
const SERVICE_DETAILS = [
  ["TMT Steel","service-tmt-steel",
   "We supply high-grade TMT steel bars from trusted mills for residential, commercial and industrial construction. With 14 years in the steel trade, we match the right grade and section to your structural requirement and deliver on schedule, every time.",
   ["Fe-500 / Fe-500D grade TMT bars","Leading brands — Rajuri Steel, Shree Om Steel","Sizes from 8 mm to 32 mm, standard 12 m lengths","Project quantities with effective & timely delivery"]],
  ["PEB Shades","service-peb",
   "Durable, efficient Pre-Engineered Building shades engineered for warehouses, factories and industrial sheds. From design to fabrication and erection, we deliver clear-span structures that go up fast and last for decades.",
   ["Design, fabrication & on-site erection","Industrial sheds, warehouses & factory roofing","Clear-span primary & secondary steel framing","Coated, weather-resistant roofing sheets"]],
  ["Material Supply","service-material",
   "A single window for every building material on your site — cement, blocks, frames, roofing, plumbing and sanitaryware. We consolidate sourcing so you deal with one reliable partner instead of a dozen vendors.",
   ["Cement, AAC blocks, cement frames & roofing","Plumbing, sanitaryware & waterproofing chemicals","Bulk supply at wholesale rates","Reliable logistics across Maharashtra"]],
  ["Consultancy","service-consultancy",
   "Expert guidance to optimise material selection, cost and schedule. We help builders and contractors estimate accurately, choose the right vendors and avoid the costly mistakes that come from inexperience.",
   ["Material estimation & take-offs","Vendor selection & rate negotiation","Cost optimisation & value engineering","On-site technical guidance"]],
  ["Fabrication Steel","service-fabrication",
   "Precision-engineered steel fabrication for strong, lasting structures. Our workshop produces trusses, gates, grills, railings and custom structural members built to your drawings and tolerances.",
   ["Custom structural fabrication to drawing","Trusses, gates, grills & railings","Welding, cutting & finishing","Quality-checked before dispatch"]],
  ["Scaffolding","service-scaffolding",
   "Safe, reliable access scaffolding supplied and erected for construction sites of every scale. Cuplock and H-frame systems with guardrails, toe boards and safety netting — installed by trained crews and checked before handover.",
   ["Cuplock & H-frame scaffolding systems","Supply with erection and dismantling","Guardrails, toe boards & safety netting","Load-checked and safety-inspected before handover"]],
];

/* Product detail — spec tables + description, keyed by image slug */
const PRODUCT_DETAILS = {
  "birla-shakti-cement": {desc:"Birla Shakti 53 Grade OPC cement for high-strength structural concrete — ideal for RCC work, columns, beams and slabs. Supplied in sealed 50 kg bags at wholesale rates with a minimum order of 100 bags.",
    moq:"100 Bag", specs:[["Brand","Birla Shakti"],["Grade","53 Grade (OPC)"],["Packaging Size","50 Kg"],["Packaging Type","HDPE / PP Bag"],["Application","Construction / RCC"],["Form","Powder"]]},
  "ambuja-cement": {desc:"Ambuja 53 Grade cement — a dependable high-strength OPC for demanding structural work. Consistent quality and setting characteristics, supplied in bulk for builders and contractors.",
    moq:"100 Bag", specs:[["Brand","Ambuja"],["Grade","53 Grade (OPC)"],["Packaging Size","50 Kg"],["Packaging Type","HDPE / PP Bag"],["Application","Construction / RCC"],["Form","Powder"]]},
  "rajuri-tmt": {desc:"Rajuri Steel TMT bars with a high-strength ribbed profile for superior bonding with concrete. Corrosion-resistant and ductile, suited to earthquake-resilient RCC structures.",
    specs:[["Brand","Rajuri Steel"],["Grade","Fe-500 / Fe-500D"],["Sizes","8, 10, 12, 16, 20, 25, 32 mm"],["Standard Length","12 metre"],["Material","Carbon Steel"],["Application","RCC Construction"]]},
  "shree-om-tmt": {desc:"Shree Om Steel TMT bars engineered for strength and weldability. A reliable choice for slabs, beams and columns across residential and commercial projects.",
    specs:[["Brand","Shree Om Steel"],["Grade","Fe-500"],["Sizes","8 – 32 mm"],["Standard Length","12 metre"],["Material","Carbon Steel"],["Application","RCC Construction"]]},
  "ms-round-pipe": {desc:"Mild steel round pipes for structural, fencing and fabrication use. Uniform wall thickness and clean welds, available across a wide range of diameters.",
    specs:[["Material","Mild Steel (MS)"],["Shape","Round"],["Size Range","1/2\" – 6\""],["Thickness","2 – 6 mm"],["Finish","Black / Galvanised"],["Application","Structural & Fabrication"]]},
  "mild-steel-plate": {desc:"Industrial mild steel plates conforming to IS 2062, for heavy fabrication, base plates and structural gussets. Cut to size on request.",
    specs:[["Material","Mild Steel (MS)"],["Grade","IS 2062"],["Thickness","5 – 50 mm"],["Surface","Hot Rolled"],["Cutting","To size on request"],["Application","Heavy Fabrication"]]},
  "hb-wire": {desc:"4 mm gray HB (Hard Bright) wire for binding, fencing and general construction use. High tensile strength with a clean, rust-resistant finish.",
    specs:[["Material","HB Steel Wire"],["Size","4 mm"],["Colour","Gray"],["Tensile","High"],["Packaging","Coil"],["Application","Binding / Fencing"]]},
  "scaffolding": {desc:"MS scaffolding systems for safe access and structural support on site. Strong, reusable frames and props available for supply and project use.",
    specs:[["Material","Mild Steel"],["Type","Cuplock / H-Frame"],["Finish","Painted / Galvanised"],["Load","Heavy Duty"],["Use","Construction Support"],["Availability","Supply"]]},
  "cement-door-frame": {desc:"Pre-cast cement door frames — termite-proof, fire-resistant and dimensionally stable alternatives to timber. A durable, low-maintenance choice for modern construction.",
    specs:[["Material","RCC / Cement"],["Application","Doorways"],["Finish","Smooth"],["Feature","Termite & Fire Proof"],["Size","Customisable"],["Form","Pre-cast"]]},
  "cement-window-frame": {desc:"Concrete window frames offering strength, weather resistance and a clean finish. Cast to standard and custom sizes for residential and commercial buildings.",
    specs:[["Material","RCC / Concrete"],["Application","Windows"],["Finish","Smooth"],["Feature","Weather Resistant"],["Size","Customisable"],["Form","Pre-cast"]]},
  "aac-block": {desc:"Lightweight AAC (Autoclaved Aerated Concrete) blocks for partition and infill walls. Excellent thermal insulation, faster construction and reduced dead load.",
    specs:[["Material","AAC"],["Sizes","600×200×(100–200) mm"],["Density","550 – 650 kg/m³"],["Feature","Thermal Insulating"],["Use","Partition Walls"],["Finish","Smooth"]]},
  "commercial-rental": {desc:"Commercial shop spaces available on rental in prime locations across Sinnar and Nashik. Well-positioned units suited to retail and trade businesses.",
    specs:[["Type","Commercial Shops"],["Service","Rental"],["Location","Sinnar / Nashik"],["Possession","On enquiry"],["Suited For","Retail / Trade"],["Terms","Negotiable"]]},
};

/* Portfolio / project detail. NOTE: scope/year are indicative — confirm with client. */
const PROJECT_DETAILS = [
  {client:"Indiabulls", title:"India Bulls Chimneys", loc:"Mumbai, Maharashtra", img:"capacity", ext:"png",
   scope:"Structural Steel & TMT Supply", year:"Ongoing", value:"High-rise",
   desc:"Supply of structural steel, TMT reinforcement and MS sections for the Indiabulls high-rise development. Coordinated bulk deliveries kept pace with a demanding construction schedule across multiple towers.",
   tags:["TMT Steel","MS Sections","Bulk Supply","Fabrication"]},
  {client:"Deepak Builders", title:"Star World", loc:"Nashik, Maharashtra", img:"project-starworld", ext:"webp",
   scope:"Cement, Steel & AAC Block Supply", year:"Delivered", value:"Residential",
   desc:"End-to-end material supply for the Star World residential complex — cement, TMT bars, AAC blocks and cement frames delivered on a phased schedule to match the build programme.",
   tags:["Cement","TMT Steel","AAC Blocks","Cement Frames"]},
  {client:"Deepak Builders", title:"Three Leaves", loc:"Nashik, Maharashtra", img:"project-threeleaves", ext:"webp",
   scope:"Bulk Cement & Steel Supply", year:"Delivered", value:"Residential",
   desc:"Wholesale supply of cement and reinforcement steel for the Three Leaves residential project, with reliable logistics and on-time delivery throughout construction.",
   tags:["Cement","TMT Steel","Material Supply","Logistics"]},
];

/* ===================== SHARED: CTA strip ===================== */
function CtaStrip({go}){
  return (
    <section className="cta-strip">
      <div className="wrap">
        <div>
          <h2>Building something? Let's get you the right materials.</h2>
          <p>Wholesale rates · trusted brands · effective &amp; timely delivery across Maharashtra.</p>
        </div>
        <button className="btn btn-primary" style={{background:'#fff'}} onClick={()=>go("/contact")}>Request a Quote <Svg d={I.arrow} vb="0 0 448 512"/></button>
      </div>
    </section>
  );
}

/* ===================== ABOUT PAGE ===================== */
function AboutPage({go}){
  const values=[
    [I.award,"14 Years of Trust","Formerly Sai Services & Building Material Supply, we've earned a reputation for reliability in the steel trade since our earliest days in Sinnar."],
    [I.truck,"On-Time Delivery","Effective and timely delivery is our promise — bulk materials reach your site on the schedule your project runs on."],
    [I.building,"Complete Range","From cement and TMT steel to AAC blocks, frames, fabrication and staffing — a single, dependable partner for the whole build."],
    [I.leaf,"Sustainable Practice","We prioritise safety, durability and environmental responsibility in every project we supply."],
    [I.desktop,"Modern Technology","Quality materials and modern methods, delivering structures built to last."],
    [I.ruler,"Quality First","The right grade for the right job — we match every material to its structural purpose."],
  ];
  return (
    <main>
      <SubHero go={go} title="About Build Core Supply" crumb="About" img="assets/img/about-2.jpg"/>
      <section className="section">
        <div className="wrap story-grid">
          <div className="reveal"><img src="assets/img/about-1.jpg" alt="Build Core Supply on site"/></div>
          <div className="reveal">
            <span className="eyebrow">Our Story</span>
            <h2 className="sec-title">Steel Experts, Trusted for 14 Years</h2>
            <p className="lead" style={{marginTop:16}}>Build Core Supply — formerly <strong>Sai Services &amp; Building Material Supply</strong> — has operated in the steel industry for the past 14 years, growing into a leading wholesaler of steel and building materials in Sinnar and Nashik.</p>
            <p style={{marginTop:14}}>Led by proprietor <strong>Uday Deshmukh</strong>, we built our name on a simple promise: quality products, fair wholesale pricing and delivery you can plan around. Today we serve builders, contractors and industrial projects across Maharashtra — supplying everything from cement and TMT steel to PEB sheds, fabrication and skilled site labour.</p>
            <button className="btn btn-primary" style={{marginTop:26}} onClick={()=>go("/contact")}>Work With Us <Svg d={I.arrow} vb="0 0 448 512"/></button>
          </div>
        </div>
      </section>
      <Stats/>
      <FoundersSection go={go}/>
      <section className="section">
        <div className="wrap">
          <div className="page-intro reveal"><span className="eyebrow c">Why Choose Us</span><h2>What Sets Us Apart</h2></div>
          <div className="values">
            {values.map(([ic,t,d])=>(
              <div className="value reveal tilt" key={t}><div className="vi"><Svg d={ic} vb={ic===I.truck||ic===I.mail?"0 0 640 512":"0 0 512 512"}/></div><h4>{t}</h4><p>{d}</p></div>
            ))}
          </div>
        </div>
      </section>
      <CtaStrip go={go}/>
    </main>
  );
}

/* ===================== SERVICES PAGE ===================== */
function ServicesPage({go}){
  return (
    <main>
      <SubHero go={go} title="Our Services" crumb="Services" img="assets/img/service-fabrication.jpg"/>
      <section className="section">
        <div className="wrap">
          <div className="page-intro reveal"><span className="eyebrow c">Build Your Dream</span><h2>End-to-End Construction Support</h2>
            <p>Six core services that take a project from material sourcing to skilled execution — all under one trusted roof.</p></div>
          {SERVICE_DETAILS.map(([t,img,desc,feats],i)=>(
            <div className="svc-row reveal" key={t}>
              <div className="svc-row-img"><img src={`assets/img/${img}.jpg`} alt={t}/></div>
              <div>
                <div className="num">{String(i+1).padStart(2,'0')}</div>
                <h3>{t}</h3>
                <p>{desc}</p>
                <ul className="svc-feat">
                  {feats.map(f=>(<li key={f}><Svg d={I.check}/> {f}</li>))}
                </ul>
              </div>
            </div>
          ))}
        </div>
      </section>
      <CtaStrip go={go}/>
    </main>
  );
}

/* ===================== FOUNDER / LEADERSHIP ===================== */
/* Real photo loads from `img` if present; otherwise an on-brand monogram shows.
   Send a headshot and drop it at the `img` path to replace the placeholder. */
const FOUNDER = {
  name:"Uday Deshmukh", initials:"UD", role:"Founder & Proprietor",
  img:"assets/team/uday-deshmukh.jpg",
  bio:[
    "Uday Deshmukh founded the business as Sai Services & Building Material Supply and has spent the last 14 years in the steel trade — building it into one of the most trusted material suppliers in Sinnar and Nashik.",
    "Hands-on from sourcing to site, he built the company's reputation on a simple rule: supply the right grade for the right job, price it fairly, and deliver when you said you would.",
  ],
  quote:"In this trade your word is your foundation. We deliver what we promise — on grade, on price, on time.",
  chips:[["14+","Years in steel"],["2000+","Projects supplied"]],
};

function FounderPortrait({person}){
  const [err,setErr]=uS3(false);
  return (
    <div className="portrait reveal">
      <div className="pframe">
        {!err
          ? <img src={person.img} alt={person.name} onError={()=>setErr(true)}/>
          : <div className="mono">
              <div className="initials">{person.initials}</div>
              <div className="hint">Add a photo of <b>{person.name}</b> — drop a headshot at <b>assets/team/</b> to replace this.</div>
            </div>}
      </div>
      <div className="pbadge"><div className="pn">14+</div><div className="pc">years of leadership</div></div>
    </div>
  );
}

function FoundersSection({go, bg=true}){
  return (
    <section className={"section"+(bg?" founder":"")}>
      <div className="wrap founder-grid">
        <FounderPortrait person={FOUNDER}/>
        <div className="reveal">
          <span className="eyebrow">Meet the Founder</span>
          <h2>{FOUNDER.name}</h2>
          <span className="role">{FOUNDER.role}</span>
          {FOUNDER.bio.map((p,i)=>(<p key={i} style={{marginTop:14}}>{p}</p>))}
          <blockquote className="fquote">“{FOUNDER.quote}”</blockquote>
          <div className="sign">{FOUNDER.name}<small>{FOUNDER.role}, Build Core Supply</small></div>
          <div className="founder-chips">
            {FOUNDER.chips.map(([v,l])=>(<div className="fc" key={l}><div className="v">{v}</div><div className="l">{l}</div></div>))}
          </div>
        </div>
      </div>
    </section>
  );
}

Object.assign(window, { SERVICE_DETAILS, PRODUCT_DETAILS, PROJECT_DETAILS, FOUNDER, CtaStrip, AboutPage, ServicesPage, FoundersSection, FounderPortrait });