# Beamme Static Site (AWS-ready)

This folder contains static HTML/CSS/JS pages converted from your React prototype.

## Files
- `index.html` (Home)
- `about.html`
- `features.html`
- `contact.html`
- `css/style.css`
- `js/main.js`
- `assets/images/` (put local copies of images here)
- `assets/icons/` (optional custom icons)

## Third-party CDNs
- Lucide icons via `js/lucide.min.js`

## Images to download and place locally (optional)
If you prefer *no external URLs*, download these and place into `assets/images/` then update the `<img src>` paths:

1. Logo
   - URL: https://qtrypzzcjebvfcihiynt.supabase.co/storage/v1/object/public/base44-prod/public/68da5c4ee8580b6d403c8076/0f0586e89_logotransparency-03.png
   - Suggested path: `assets/images/logo.png`

2. Home hero background
   - URL: https://images.unsplash.com/photo-1558618666-fcd25c85cd64?auto=format&fit=crop&w=2070&q=80
   - Suggested path: `assets/images/hero.jpg` (used in `index.html` inline style)

3. Home "About" image
   - URL: https://images.unsplash.com/photo-1600880292203-757bb62b4baf?auto=format&fit=crop&w=1170&q=80
   - Suggested path: `assets/images/about-hero.jpg`

4. About page illustration
   - URL: https://images.unsplash.com/photo-1573164713714-d95e436ab8d6?auto=format&fit=crop&w=1169&q=80
   - Suggested path: `assets/images/team.jpg`

Update the HTML to use local paths if required (search for the URLs above).

## Deploying to AWS S3 + CloudFront (quick tips)
1. Create an S3 bucket (e.g., `beamme-site`) with static website hosting enabled.
2. Upload all files preserving the folder structure.
3. Set `index.html` as the index document and (optionally) `index.html` as the error document.
4. Make files public (or serve via CloudFront for better performance and HTTPS).
5. (Optional) Add CloudFront distribution with your domain and attach an ACM certificate for HTTPS.

## Notes
- The FAQ accordions are implemented with simple vanilla JS.
- Icons are drawn via Lucide CDN and initialised in `js/main.js`.
- The navigation is fixed and responsive; content has top padding to account for it.
- All colors and gradients follow your React design language (gradient-text / gradient-bg / glass effect).