// Shared utilities + data for the Digit Estate marketing site UI kit
// Exposed to window so each script file can use them.

const { useState, useEffect, useRef, useCallback, useMemo, createContext, useContext } = React;

// --- Scroll reveal hook (IntersectionObserver) -----------------
function useReveal(threshold = 0.15) {
  const ref = useRef(null);
  useEffect(() => {
    const el = ref.current;
    if (!el) return;
    const io = new IntersectionObserver(
      (entries) => entries.forEach((e) => { if (e.isIntersecting) el.classList.add('is-in'); }),
      { threshold }
    );
    io.observe(el);
    return () => io.disconnect();
  }, [threshold]);
  return ref;
}

// --- Tiny SVG icon system (Lucide-style line icons) ------------
function Icon({ name, size = 20, stroke = 1.5, className = '', style = {} }) {
  const paths = {
    arrow:    <><line x1="3" y1="12" x2="21" y2="12"/><polyline points="14 5 21 12 14 19"/></>,
    arrowUp:  <><line x1="12" y1="19" x2="12" y2="5"/><polyline points="5 12 12 5 19 12"/></>,
    arrowDown:<><line x1="12" y1="5" x2="12" y2="19"/><polyline points="19 12 12 19 5 12"/></>,
    arrowDL:  <><line x1="17" y1="7" x2="7" y2="17"/><polyline points="17 17 7 17 7 7"/></>,
    plus:     <><line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/></>,
    minus:    <><line x1="5" y1="12" x2="19" y2="12"/></>,
    close:    <><line x1="6" y1="6" x2="18" y2="18"/><line x1="6" y1="18" x2="18" y2="6"/></>,
    menu:     <><line x1="3" y1="7" x2="21" y2="7"/><line x1="3" y1="17" x2="21" y2="17"/></>,
    mail:     <><rect x="3" y="5" width="18" height="14" rx="0"/><polyline points="3 7 12 13 21 7"/></>,
    phone:    <><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-6A19.79 19.79 0 0 1 2.12 4.18 2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.13.96.37 1.9.7 2.81a2 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-.45c.91.33 1.85.57 2.81.7A2 2 0 0 1 22 16.92z"/></>,
    pin:      <><path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"/><circle cx="12" cy="10" r="3"/></>,
    clock:    <><circle cx="12" cy="12" r="9"/><polyline points="12 7 12 12 16 14"/></>,
    bed:      <><path d="M3 12V6h18v6"/><path d="M3 18v-3a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v3"/><circle cx="7" cy="10" r="1"/></>,
    area:     <><rect x="3" y="3" width="18" height="18"/><line x1="3" y1="9" x2="9" y2="3"/><line x1="15" y1="21" x2="21" y2="15"/></>,
    bath:     <><path d="M5 12V6a2 2 0 0 1 2-2h0a2 2 0 0 1 2 2v0"/><path d="M3 12h18v3a4 4 0 0 1-4 4H7a4 4 0 0 1-4-4z"/></>,
    star:     <polygon points="12 2 14.9 8.9 22 9.5 16.6 14.2 18.3 21.2 12 17.4 5.7 21.2 7.4 14.2 2 9.5 9.1 8.9" fill="currentColor" stroke="none"/>,
    play:     <polygon points="6 4 20 12 6 20 6 4" fill="currentColor" stroke="none"/>,
    instagram:<><rect x="3" y="3" width="18" height="18" rx="0"/><circle cx="12" cy="12" r="4"/><circle cx="17.5" cy="6.5" r="0.6" fill="currentColor"/></>,
    facebook: <><path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z"/></>,
    linkedin: <><path d="M16 8a6 6 0 0 1 6 6v7h-4v-7a2 2 0 0 0-4 0v7h-4v-7a6 6 0 0 1 6-6z"/><rect x="2" y="9" width="4" height="12"/><circle cx="4" cy="4" r="2"/></>,
    search:   <><circle cx="11" cy="11" r="7"/><line x1="21" y1="21" x2="16.6" y2="16.6"/></>,
  };
  return (
    <svg width={size} height={size} viewBox="0 0 24 24" fill="none" stroke="currentColor"
         strokeWidth={stroke} strokeLinecap="round" strokeLinejoin="round"
         className={className} style={style}>
      {paths[name]}
    </svg>
  );
}

// --- Sample project data ---------------------------------------
const PROJECTS = [
  {
    id: 'travertine-villa-04', code: 'No. 04', title: 'Travertine Villa',
    location: 'Saadiyat Island, Abu Dhabi', year: '2024 — 2025',
    category: 'Villa',
    area: '720 m²', bedrooms: 5, bathrooms: 6, built: '6 months', value: 'AED 38.5 M',
    image: 'assets/imagery/villa-sunset-exterior.png',
    blurb: 'A two-storey residence carved from Italian travertine, with a reflecting pool that wraps the southern elevation and panoramic glazing throughout the principal floor.',
  },
  {
    id: 'penthouse-meridian', code: 'No. 07', title: 'Meridian Penthouse',
    location: 'Downtown Dubai', year: '2024',
    category: 'Penthouse',
    area: '460 m²', bedrooms: 3, bathrooms: 4, built: '4 months', value: 'AED 52.0 M',
    image: 'assets/imagery/penthouse-skyline.png',
    blurb: 'A circular living core opens onto a skyline terrace. Burnished brass, ivory boucle, and travertine walls form a calm theatre for the city below.',
  },
  {
    id: 'living-fireplace-01', code: 'No. 02', title: 'Atrium Residence',
    location: 'Hudayriyat Island', year: '2023 — 2024',
    category: 'Estate',
    area: '1,180 m²', bedrooms: 7, bathrooms: 9, built: '11 months', value: 'AED 64.8 M',
    image: 'assets/imagery/living-fireplace.png',
    blurb: 'Double-height great room anchored by a horizontal travertine fireplace and a custom black marble plinth. Built for hosting.',
  },
  {
    id: 'bedroom-bay', code: 'No. 09', title: 'Bay Suite',
    location: 'Palm Jumeirah', year: '2024',
    category: 'Penthouse',
    area: '85 m² (master)', bedrooms: 1, bathrooms: 2, built: '3 months', value: 'On request',
    image: 'assets/imagery/bedroom-bay-sunset.png',
    blurb: 'A primary suite oriented to the western horizon — copper cove lighting, oiled walnut and stone, dressing pavilion to the rear.',
  },
  {
    id: 'living-golden', code: 'No. 11', title: 'Golden Hour House',
    location: 'Emirates Hills', year: '2025',
    category: 'Villa',
    area: '950 m²', bedrooms: 6, bathrooms: 7, built: '9 months', value: 'AED 71.2 M',
    image: 'assets/imagery/living-skyline-golden.png',
    blurb: 'Programmed around the sun. Travertine, brass and amber leather. Every elevation calibrated to catch the late afternoon light.',
  },
  {
    id: 'bedroom-skyline', code: 'No. 12', title: 'Skyline Suite',
    location: 'Business Bay, Dubai', year: '2024',
    category: 'Penthouse',
    area: '110 m² (master)', bedrooms: 1, bathrooms: 2, built: '4 months', value: 'On request',
    image: 'assets/imagery/bedroom-skyline-sunset.png',
    blurb: 'A floor-to-ceiling glass corner suite with custom upholstered headboard wall and bespoke brass joinery throughout.',
  },
];

const TESTIMONIALS = [
  { name: 'Lara Punzalan', role: 'Architect',           quote: 'Their team brought our vision to life with precision and style. A rare collaboration — patient, considered, exact.' },
  { name: 'Ahmad Kim',     role: 'Principal · Mubadala',quote: 'Digit Estate delivers a level of finish I haven\u2019t seen anywhere in the region. The travertine work alone is reason enough to call them.' },
  { name: 'Yazan Kharouf', role: 'Engineer',            quote: 'Punctual, communicative, immaculate. Every milestone met. I would absolutely recommend them to anyone with a serious brief.' },
  { name: 'Akash M.',      role: 'Project Manager',     quote: 'Very professional and detail-oriented. They listened, and they delivered. Appreciating the best for the new chapter ahead.' },
];

const CLIENTS = [
  { name: 'Mubadala Investment Company', tag: 'Sovereign Investor',     blurb: 'Global investor with an entrepreneurial mandate. Three penthouse residences delivered, 2022–2024.' },
  { name: 'Miral',                       tag: 'Destination Developer',  blurb: 'Driving force behind immersive destinations across Yas Island. Two estate-scale projects under way.' },
  { name: 'Farah Experiences',           tag: 'Hospitality',            blurb: 'Established 2008. We have delivered private residences for principals across the group portfolio.' },
  { name: 'Yas Asset Management',        tag: 'Leisure & Lifestyle',    blurb: 'Trusted operator and manager of vibrant lifestyle destinations within Yas Island, Abu Dhabi.' },
  { name: 'Al Forsan',                   tag: 'International Sports',   blurb: 'Marriott Al Forsan, Khalifa City — interior renovation of the executive lounges and presidential suite.' },
  { name: 'Department of Culture',       tag: 'Government',             blurb: 'Civic and heritage interior work, including the Al Wathba interpretive pavilion programme.' },
];

const SERVICES = [
  { code: '01', title: 'Architecture',         tagline: 'Form, light, structure.',
    items: ['Concept & schematic design', 'Detailed construction documents', 'Facade & cladding systems', 'Sustainable design & passive strategy'] },
  { code: '02', title: 'Interiors',            tagline: 'A vernacular for living.',
    items: ['Space planning & joinery', 'Material & finish selection', 'Bespoke furniture programmes', 'Lighting & ambience design'] },
  { code: '03', title: 'Construction',         tagline: 'Built precisely.',
    items: ['Turnkey villa construction', 'Fast-track interior fit-out', 'Marble, travertine & stonework', 'Mechanical, electrical & plumbing'] },
  { code: '04', title: 'Property Atelier',     tagline: 'Stewardship after handover.',
    items: ['Annual maintenance contracts', 'Curated furnishing & art programmes', 'Concierge & estate management', 'Resale & portfolio advisory'] },
];

// --- Expose to other Babel scripts -----------------------------
Object.assign(window, {
  useState, useEffect, useRef, useCallback, useMemo, createContext, useContext,
  useReveal, Icon,
  PROJECTS, TESTIMONIALS, CLIENTS, SERVICES,
});