# Earthen theme — codeless .bnp manifest (WO-WZ-021 Phase B1).
# Synthesized into manifest.pb by `ninja plugin build` (no plugin.wasm).
theme_presets: presets.json
bundled_fonts: fonts.json
master_pages: master_pages.json
required_icon_packs: [lucide]

system_templates:
  - key: earthen
    title: Earthen
    description: "Botanical nonprofit theme in moss, clay, sage and cream"

page_templates:
  - system: earthen
    key: default
    title: Default
    description: "Standard nonprofit page with header, main and footer"
    slots: [header, main, footer]
  - system: earthen
    key: landing
    title: Landing
    description: "Mission hero plus CTA bands for campaigns and donation drives"
    slots: [hero, main, cta, footer]
  - system: earthen
    key: article
    title: Article
    description: "Long-form storytelling with byline rail"
    slots: [header, lede, main, aside, footer]
  - system: earthen
    key: full-width
    title: Full Width
    description: "Edge-to-edge imagery for reports and galleries"
    slots: [header, main, footer]
  - system: earthen
    key: blog-index
    title: Field Journal
    description: "Blog index with a botanical masthead, featured and post-grid slots"
    slots: [header, featured, main, footer]
  - system: earthen
    key: contact
    title: Get in Touch
    description: "Contact layout with an optional aside for hours and location"
    slots: [header, main, aside, footer]
  - system: earthen
    key: auth
    title: Members
    description: "Centred auth shell with wordmark and a fern crest"
    slots: [main, footer]

template_overrides:
  # Chrome (4)
  - { template: earthen, block: navbar }
  - { template: earthen, block: footer }
  - { template: earthen, block: utility-bar }
  - { template: earthen, block: announcement-bar }
  # Marketing (12)
  - { template: earthen, block: hero }
  - { template: earthen, block: feature-grid }
  - { template: earthen, block: rich-section }
  - { template: earthen, block: stats }
  - { template: earthen, block: testimonial }
  - { template: earthen, block: logo-strip }
  - { template: earthen, block: pricing }
  - { template: earthen, block: team }
  - { template: earthen, block: faq }
  - { template: earthen, block: timeline }
  - { template: earthen, block: cta }
  - { template: earthen, block: countdown }
  # Primitives (11)
  - { template: earthen, block: heading }
  - { template: earthen, block: text }
  - { template: earthen, block: rich-text }
  - { template: earthen, block: image }
  - { template: earthen, block: quote }
  - { template: earthen, block: divider }
  - { template: earthen, block: button }
  - { template: earthen, block: card }
  - { template: earthen, block: gallery }
  - { template: earthen, block: video-embed }
  - { template: earthen, block: audio-embed }
  # Commerce / local (6)
  - { template: earthen, block: menu-list }
  - { template: earthen, block: event-list }
  - { template: earthen, block: contact-form }
  - { template: earthen, block: contact-card }
  - { template: earthen, block: hours-location }
  - { template: earthen, block: social-links }
  # Blog family (12)
  - { template: earthen, block: blog-hero }
  - { template: earthen, block: featured-posts }
  - { template: earthen, block: related-posts }
  - { template: earthen, block: popular-posts }
  - { template: earthen, block: category-list }
  - { template: earthen, block: post-hero }
  - { template: earthen, block: post-metadata }
  - { template: earthen, block: author-bio }
  - { template: earthen, block: author-bio-hero }
  - { template: earthen, block: newsletter-signup }
  - { template: earthen, block: breadcrumbs }
  - { template: earthen, block: sidebar-nav }
  # Auth surface (3)
  - { template: earthen, block: auth-form }
  - { template: earthen, block: password-reset-form }
  - { template: earthen, block: auth-status }
  # System (1)
  - { template: earthen, block: page-suggestions }

email_wrappers:
  - earthen

css:
  input_css_append: |
    /* Earthen — theme utilities injected via CSSManifest.InputCSSAppend. */
    /* All colour values reference the 19-token HSL custom properties so they */
    /* shift with the active preset (mossbed, clay-field, wet-loam). */

    /* Bundled faces. The host does not yet emit @font-face for fonts.json
     * (LoadedPlugin.BundledFonts is inert), so the theme declares them itself
     * against the served /templates/earthen/fonts/... paths. Presets set
     * typography.fontHeading/body to template:earthen:<Family> so
     * --font-heading/--font-body resolve to these families. Families/weights
     * match fonts.json exactly. */
    @font-face { font-family: 'Fraunces'; src: url('/templates/earthen/fonts/fraunces-latin-400.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }
    @font-face { font-family: 'Fraunces'; src: url('/templates/earthen/fonts/fraunces-latin-600.woff2') format('woff2'); font-weight: 600; font-style: normal; font-display: swap; }
    @font-face { font-family: 'Work Sans'; src: url('/templates/earthen/fonts/worksans-latin-400.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }
    @font-face { font-family: 'Work Sans'; src: url('/templates/earthen/fonts/worksans-latin-600.woff2') format('woff2'); font-weight: 600; font-style: normal; font-display: swap; }

    /* Paper grain backdrop — a single inline SVG noise pattern keeps page weight
       inside the marketplace gate (≤ 81920 bytes). */
    .bg-paper-grain {
        background-color: hsl(var(--background));
        background-image: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%27160%27%20height%3D%27160%27%20viewBox%3D%270%200%20160%20160%27%3E%3Cfilter%20id%3D%27n%27%3E%3CfeTurbulence%20type%3D%27fractalNoise%27%20baseFrequency%3D%270.9%27%20numOctaves%3D%272%27%20seed%3D%274%27%2F%3E%3CfeColorMatrix%20values%3D%270%200%200%200%200.36%200%200%200%200%200.32%200%200%200%200%200.24%200%200%200%200.05%200%27%2F%3E%3C%2Ffilter%3E%3Crect%20width%3D%27160%27%20height%3D%27160%27%20filter%3D%27url%28%23n%29%27%2F%3E%3C%2Fsvg%3E");
        background-repeat: repeat;
        background-size: 240px 240px;
    }
    
    /* Botanical hairline divider — used inside .botanical-rule sections. */
    .botanical-rule > span {
        display: inline-block;
    }
    
    /* Hand-drawn crayon underline on h2 — uses currentColor and primary token. */
    .crayon-underline {
        position: relative;
        padding-bottom: 0.35em;
    }
    .crayon-underline::after {
        content: "";
        position: absolute;
        left: 0;
        right: auto;
        bottom: 0;
        height: 6px;
        width: 2.5em;
        background-color: hsl(var(--accent) / 0.4);
        border-radius: 4px 8px 6px 12px;
        transform: skewY(-1deg);
    }
    
    /* Botanical drop cap — applied to the first paragraph of .drop-cap-host. */
    .drop-cap-host > p:first-of-type::first-letter,
    .drop-cap > p:first-of-type::first-letter,
    .drop-cap::first-letter {
        font-family: var(--font-heading, "Fraunces", "Playfair Display", Georgia, serif);
        color: hsl(var(--primary));
        float: left;
        font-size: 3.4em;
        line-height: 0.85;
        margin: 0.15em 0.18em 0 0;
        font-weight: 600;
    }
    
    /* Tile selection (donation CTA) — uses primary ring when checked. */
    .earthen-tile input[type="radio"]:checked + span {
        color: hsl(var(--primary));
    }
    .earthen-tile:has(input[type="radio"]:checked) {
        box-shadow: 0 0 0 2px hsl(var(--primary));
    }
    
    /* Partner logos — grayscale at rest, full colour on hover. */
    .earthen-partner-img,
    .earthen-partner-fallback {
        filter: grayscale(1);
        opacity: 0.85;
        transition: filter 200ms ease, opacity 200ms ease;
    }
    .earthen-partner-tile:hover .earthen-partner-img,
    .earthen-partner-link:hover .earthen-partner-img,
    .earthen-partner-link:focus-visible .earthen-partner-img,
    .earthen-partner-tile:hover .earthen-partner-fallback,
    .earthen-partner-link:hover .earthen-partner-fallback {
        filter: grayscale(0);
        opacity: 1;
    }
    
    /* Paper-grain frame around field-note imagery. */
    .earthen-paper-frame {
        box-shadow: inset 0 0 0 1px hsl(var(--border) / 0.6);
    }
    .earthen-paper-frame-inner {
        box-shadow: 0 1px 2px hsl(var(--foreground) / 0.06);
    }
    
    /* Footer links — botanical underline on hover. */
    .earthen-footer-link {
        text-decoration: none;
        border-bottom: 1px solid transparent;
        transition: color 150ms ease, border-color 150ms ease;
    }
    .earthen-footer-link:hover,
    .earthen-footer-link:focus-visible {
        color: hsl(var(--primary-foreground));
        border-bottom-color: hsl(var(--accent));
    }
    
    /* Buttons — focus ring follows the active preset. */
    .earthen-button:focus-visible {
        outline: 2px solid hsl(var(--ring));
        outline-offset: 2px;
    }
    
    /* Article aside — keeps the byline rail comfortable on mobile. */
    .earthen-aside {
        color: hsl(var(--muted-foreground));
    }
    
    /* Ensure article main column uses the Spectral body fallback. */
    .earthen-article {
        font-family: var(--font-body, "Spectral", Georgia, serif);
        color: hsl(var(--foreground));
    }
    
    /* Divider glyph — softer stroke at rest. */
    .earthen-glyph {
        color: hsl(var(--primary));
    }