Static website for **jumpers.stormcloudhills.com**. Plain HTML/CSS/JS — no build step, no framework. Just upload the contents of this `scj/` folder to the web host.
## Files
| File | What it is |
|------|-----------|
| `index.html` | The main one-page site (hero, available, mamas, care, shipping, about, contact). |
| `care-sheet.html` | Print-friendly care sheet. This is what the QR code points to. |
| `styles.css` | All styling (dark storm palette, red accent). |
| `script.js` | Nav, scroll animations, and the inquiry form. **Edit `FORM_ENDPOINT` here to enable Gmail delivery — see below.** |
| `form-handler.gs` | Google Apps Script that emails form submissions from the shop's own Gmail. Setup steps are inside the file. |
| `assets/brand/` | Logo, mascot (Nimbus) and hero graphics. |
| `assets/care/` | Care-sheet QR code (`care-qr.png` / `.svg`). |
## Deploying
It's a static site — upload everything in `scj/` to the document root for the `jumpers.stormcloudhills.com` subdomain (via the host's file manager, FTP, Netlify, Cloudflare Pages, GitHub Pages, etc.). No server or database needed. Keep the `assets/` folder alongside the HTML files.
## The inquiry form (two modes)
1.**Now — `mailto:` (zero setup).** Submitting the form opens the visitor's email app with a pre-filled message to `stormcloudjumpers@gmail.com`. Works out of the box.
2.**Upgrade — send via Gmail, no email app needed.** Deploy `form-handler.gs` as a Google Apps Script web app (5-minute steps are in that file), copy the resulting `/exec` URL, and paste it into `FORM_ENDPOINT` near the top of `script.js`. The form will then email submissions straight to the inbox and fall back to `mailto:` only if the request fails. **This is the current plan** (routes through her own Gmail — no third-party vendor, no cost).
3.**Future — fully self-hosted (once the web host is chosen).** If the host runs PHP (most shared hosts do), a small `contact.php` can send the mail from our own server — no Google involved. If the site lands on Netlify/Cloudflare/Vercel, use that platform's built-in form/function handler. Either is a small swap on the same form; the front-end doesn't change. Deferred until hosting is decided.
- **Prices / availability:** find the spider's `<article class="card">` block. Change the `<span class="price">` amount, or the `<span class="badge">Available</span>` text (e.g. to `Reserved` / `Sold`). Add `badge--soft` to the class for a muted badge.
- **Add / swap a photo:** drop the new image in the right `assets/spiders/...` folder and update the `<img src="...">`. Keep images web-sized (~1000px wide, JPEG) so pages stay fast.
- **Add a spider:** copy an existing `<article class="card">…</article>` block and edit the text, image, price, and the `data-inquire="..."` label (that label pre-fills the "Which spider?" field when someone clicks Reserve).
- **Care sheet text:** edit `care-sheet.html` (and the matching cards in the Care section of `index.html`).
## To do (waiting on Mom)
- **Photos of the new boys:** Gully, Noble, Hexx & Magick. Right now the "Regal Jumper Males" card shows Ivan and names all five. Add their photos when available. (Nashville has passed away and is not listed.)
- Optional: confirm the **Paraphidippus fartilis** waitlist note and update when they're available.
## Credits
Brand mascot: **Nimbus**. Palette: storm-black + red. Fonts: Oswald + Inter (loaded from Google Fonts).
