# Custom Ghost theme deployment and bilingual homepage

Use this workflow when Margarita asks to build or redesign the public `cosmosluminosity.com` site, especially a bilingual RU/EN landing page.

## Deployment without container restart

Ghost can reload and activate a changed theme through the Admin API. Editing the mounted theme directory alone may leave the live process serving the cached version, while restarting Docker may require operator privileges.

1. Back up the active theme directory.
2. Edit `/opt/cosmosluminosity/content/themes/clean/`.
3. Package the **contents** of the theme directory so `package.json` is at the ZIP root:

```bash
cd /opt/cosmosluminosity/content/themes/clean
zip -qr /tmp/cosmos-theme.zip .
```

4. Upload `/tmp/cosmos-theme.zip` to:

```text
POST /ghost/api/admin/themes/upload/
```

Use the same JWT construction, loopback URL, `Host`, `X-Forwarded-Proto`, `Origin`, and API version headers as `/usr/local/bin/cosmos`. Send multipart form data with field name `file`. A successful response reports the theme with `"active": true` and makes the new templates live immediately.

5. Treat nonfatal Ghost theme-validation messages as cleanup work, not proof that upload failed. Ensure `package.json` includes `author.name` and `author.email`; add Ghost-required Koenig classes when maintaining general post/page rendering.

## RU/EN switching pattern

For a single-page bilingual launch, keep both translations in the markup:

```html
<span data-ru="Ворота" data-en="Gateways">Ворота</span>
```

Add a `RU / EN` control that:

- changes every `[data-ru][data-en]` node;
- updates `document.documentElement.lang`;
- stores the explicit choice in `localStorage`;
- otherwise chooses Russian for Russian browser locales and English for other locales.

Translate all reader-facing copy: navigation, buttons, section labels, headings, body text, captions, product descriptions, and footer. Brand/product names may remain unchanged.

## Animation fail-safe

Never make core content depend on JavaScript to become visible. Default reveal elements to visible and hide them only after JS confirms animation support:

```css
[data-reveal] { opacity: 1; transform: none; }
.motion-ready [data-reveal] { opacity: 0; transform: translateY(28px); }
.motion-ready [data-reveal].visible { opacity: 1; transform: none; }
```

JavaScript may add `motion-ready` before registering `IntersectionObserver`. Add a short timeout that reveals any remaining elements. Respect `prefers-reduced-motion`.

## Verification

After upload:

1. Fetch the public homepage and verify HTTP 200, expected page size, a unique new-copy marker, language controls, and asset URLs.
2. Open the live site in a browser and inspect the primary desktop viewport visually.
3. Check browser console/resource state, horizontal overflow, image loading, and the number of hidden reveal elements.
4. Click both `RU` and `EN`; verify the active control, `<html lang>`, hero copy, navigation, major section headings, and body copy.
5. Scroll or use a visual screenshot to confirm lower sections are not blank due to reveal animation.
6. Return the canonical link. A temporary cache-busting query such as `?v=3` may be supplied for immediate review, but also confirm the plain URL works.

## Content discipline

- Build from the current approved positioning and Portal sources; do not silently publish source drafts as canon.
- Preserve Cosmos Luminosity language: wholeness, body/state/future, adaptive systems, Gateways, meaning creation, violet/yellow/gold.
- Avoid unapproved scientific, therapeutic, medical, or guaranteed-result claims.
- Use real supplied artwork rather than generic stock imagery where it strengthens the brand.