/* ─────────────────────────────────────────────
   Site mocks — real screenshots of each source site.
   Each export is a render function returning React.
   ───────────────────────────────────────────── */

const SCREENSHOT_STYLE = {
  position: 'absolute', inset: 0,
  width: '100%', height: '100%',
  objectFit: 'cover',
  objectPosition: 'top center',
  display: 'block'
};

window.SiteMock = {
  'spec-014': function () {
    return React.createElement('img', {
      src: 'assets/screenshots/framer.png',
      alt: 'framer.com',
      style: SCREENSHOT_STYLE,
      draggable: false
    });
  },
  'spec-011': function () {
    return React.createElement('img', {
      src: 'assets/screenshots/linear.png',
      alt: 'linear.app',
      style: SCREENSHOT_STYLE,
      draggable: false
    });
  },
  'spec-009': function () {
    return React.createElement('img', {
      src: 'assets/screenshots/stripe.png',
      alt: 'stripe.com',
      style: SCREENSHOT_STYLE,
      draggable: false
    });
  },
  'spec-007': function () {
    return React.createElement('img', {
      src: 'assets/screenshots/vercel.png',
      alt: 'vercel.com',
      style: SCREENSHOT_STYLE,
      draggable: false
    });
  },
  'spec-005': function () {
    return React.createElement('img', {
      src: 'assets/screenshots/notion.png',
      alt: 'notion.so',
      style: SCREENSHOT_STYLE,
      draggable: false
    });
  },
  'spec-002': function () {
    return React.createElement('img', {
      src: 'assets/screenshots/raycast.png',
      alt: 'raycast.com',
      style: SCREENSHOT_STYLE,
      draggable: false
    });
  }
};
