// shared.jsx — small helpers reused by all three home directions

const PROJECTS = [
  { id: 'beautygrass', name: 'Beautygrass', kind: 'Skincare e-commerce', platform: 'Shopify', year: '2024', img: 'img/work-beautygrass.jpg', tag: 'beauty / dtc' },
  { id: 'creative-breed', name: 'Creative Breed', kind: 'Studio site', platform: 'Squarespace', year: '2024', img: 'img/work-creative-breed.jpg', tag: 'studio / branding' },
  { id: 'ember', name: 'Ember & Beam', kind: 'Home goods shop', platform: 'Shopify', year: '2024', img: 'img/work-ember.jpg', tag: 'lifestyle / dtc' },
  { id: 'hustle', name: 'Hustle & Cashflow', kind: 'Personal brand', platform: 'WordPress', year: '2023', img: 'img/work-hustle.jpg', tag: 'creator / education' },
  { id: 'edupreneurs', name: 'Edupreneurs', kind: 'Membership platform', platform: 'Squarespace', year: '2024', img: 'img/work-edupreneurs.jpg', tag: 'education / b2b' },
  { id: 'pietanza', name: 'Pie Tanza', kind: 'Pizzeria chain', platform: 'Squarespace', year: '2023', img: 'img/work-pietanza.jpg', tag: 'hospitality' },
  { id: 'lacausa', name: 'Lacausa', kind: 'Apparel brand', platform: 'Shopify', year: '2023', img: 'img/work-lacausa.jpg', tag: 'fashion / dtc' },
  { id: 'lawyer', name: 'Halpern Law', kind: 'Boutique law firm', platform: 'Squarespace', year: '2024', img: 'img/work-lawyer.jpg', tag: 'professional services' },
  { id: 'parkcounty', name: 'Explore Park County', kind: 'Tourism board', platform: 'Squarespace', year: '2023', img: 'img/work-parkcounty.jpg', tag: 'tourism / non-profit' },
  { id: 'midcity', name: 'Mid City CDE', kind: 'Community nonprofit', platform: 'Squarespace', year: '2024', img: 'img/work-midcity.jpg', tag: 'non-profit' },
  { id: 'rosemont', name: 'Rosemont North York', kind: 'Real estate', platform: 'Squarespace', year: '2024', img: 'img/work-rosemont.jpg', tag: 'real estate' },
  { id: 'estes', name: 'Estes Park Spotlight', kind: 'Local magazine', platform: 'Squarespace', year: '2023', img: 'img/work-estes.jpg', tag: 'media / editorial' },
];

const SERVICES = [
  { n: '01', t: 'Custom Squarespace', d: 'Design & build on the platform I know best — fluid layouts, custom code, Commerce, scheduling, members.' },
  { n: '02', t: 'Custom Shopify', d: 'Themes that don’t look like themes. Storefront polish, product pages that convert, careful migrations.' },
  { n: '03', t: 'Custom WordPress', d: 'Block-theme builds and Elementor sites. Ownership, flexibility, and a CMS your team won’t fight.' },
  { n: '04', t: 'Brand & visual identity', d: 'Logo, type system, color, and the small details that make a brand actually feel like one.' },
  { n: '05', t: 'Redesigns & refreshes', d: 'Keep what’s working, fix what isn’t. Often the highest-leverage thing a small business can do.' },
  { n: '06', t: 'SEO setup & optimization', d: 'Real-world technical SEO, content structure, and the boring metadata work that quietly compounds.' },
  { n: '07', t: 'Platform migrations', d: 'Wix → Squarespace, Squarespace → Shopify, anything → WordPress. URL maps, redirects, no traffic loss.' },
  { n: '08', t: 'Ongoing support', d: 'A monthly retainer for tweaks, updates, page launches, and that one thing you keep meaning to fix.' },
];

const TESTIMONIALS = [
  { q: 'Maia made the whole process feel weirdly easy. We launched in three weeks and the site still looks better than anything we briefed her on.', who: 'Sasha L.', role: 'Founder, Ember & Beam' },
  { q: 'She thinks like a designer, codes like a developer, and replies to emails faster than my project manager. Hire her, then hire her again.', who: 'Theo R.', role: 'Creative Director, Creative Breed' },
  { q: 'Our Shopify migration was supposed to take two months. Maia did it in five weeks and we didn’t lose a single product or order in the cutover.', who: 'Priya M.', role: 'Owner, Beautygrass' },
  { q: 'I came in with a Pinterest board and a budget. I left with a Squarespace site I’m proud to send to clients. Couldn’t recommend her more.', who: 'Jordan K.', role: 'Halpern Law' },
];

const PROCESS = [
  { n: '01', t: 'Get acquainted', d: 'A 30-minute call. You tell me what you need, I tell you whether I’m the right fit. No pitch deck.' },
  { n: '02', t: 'Map it out', d: 'Sitemap, content plan, references, and a fixed-price proposal. Everything on one page.' },
  { n: '03', t: 'Design in the open', d: 'Live in-platform mockups instead of static Figma. You can click around the actual site as it grows.' },
  { n: '04', t: 'Build & polish', d: 'Real content, real animations, real responsiveness. Two rounds of revisions and a launch checklist.' },
  { n: '05', t: 'Hand it over', d: 'A Loom walkthrough, a written manual, and 30 days of free post-launch support. You own everything.' },
];

const PLATFORMS = [
  { n: 'Squarespace', dot: '#7a8a55' },
  { n: 'Shopify',     dot: '#c98455' },
  { n: 'WordPress',   dot: '#2b3a2a' },
];

// Striped placeholder when an image isn't available — kept for safety.
function Placeholder({ label, w='100%', h='100%', stripeA='#d9d4c2', stripeB='#cfc8b3' }) {
  const bg = `repeating-linear-gradient(135deg, ${stripeA} 0 12px, ${stripeB} 12px 24px)`;
  return (
    <div style={{ width:w, height:h, background:bg, display:'flex', alignItems:'center', justifyContent:'center',
                  fontFamily:"'JetBrains Mono', monospace", fontSize:11, color:'rgba(0,0,0,.5)', letterSpacing:'.08em', textTransform:'uppercase' }}>
      {label}
    </div>
  );
}

// A tiny rotating signet that all three directions reuse for personality.
function Signet({ size=120, color='#2b3a2a', textColor='#ecead8', text='Maia Hariton • Web design & dev • ', center='✿' }) {
  const r = size/2;
  // Build a wavy/scalloped outer edge so it reads as a hand-cut paper stamp, not a flat coin.
  const petals = 28;
  const outer = r;
  const inner = r * 0.94;
  const points = [];
  for (let i = 0; i < petals * 2; i++) {
    const a = (i / (petals * 2)) * Math.PI * 2;
    const rad = i % 2 === 0 ? outer : inner;
    points.push([r + Math.cos(a) * rad, r + Math.sin(a) * rad]);
  }
  const scallop = 'M ' + points.map(([x,y]) => x.toFixed(2)+','+y.toFixed(2)).join(' L ') + ' Z';
  return (
    <svg viewBox={`0 0 ${size} ${size}`} width={size} height={size} style={{ display:'block' }}>
      <defs>
        <path id={`sig-${size}`} d={`M ${r}, ${r} m -${r-16}, 0 a ${r-16},${r-16} 0 1,1 ${(r-16)*2},0 a ${r-16},${r-16} 0 1,1 -${(r-16)*2},0`} />
      </defs>
      <path d={scallop} fill={color} />
      <circle cx={r} cy={r} r={r-7} fill="none" stroke={textColor} strokeOpacity=".55" strokeWidth="1" strokeDasharray="2 3" />
      <text fontFamily="'JetBrains Mono', monospace" fontSize={size*0.085} fill={textColor} letterSpacing="2.4" fontWeight="600">
        <textPath href={`#sig-${size}`}>{text + text}</textPath>
      </text>
      <text x={r} y={r+size*0.10} textAnchor="middle" fontFamily="'Instrument Serif', serif" fontSize={size*0.32} fill={textColor}>{center}</text>
    </svg>
  );
}

Object.assign(window, { PROJECTS, SERVICES, TESTIMONIALS, PROCESS, PLATFORMS, Placeholder, Signet });
