Windsurf AI Integration

# Forge Project Guidelines for Windsurf AI

## Project Overview
This is a Forge project for web hosting and deployment.

## Project Structure
- Static HTML, CSS, and JavaScript files
- Assets organized in logical directories (/css/, /js/, /images/, /assets/)
- Must include index.html as the main entry point
- Optional forgerc.txt for URL routing configuration

## Forge Platform Requirements
- **index.html**: Required main entry point for the site
- **forgerc.txt**: Optional configuration file for custom URL routing
- **Static Assets**: All CSS, JS, images, and other assets
- **Forms**: Use Forge Forms service for contact forms and data collection

## Development Standards
- Use semantic HTML5 elements
- Mobile-first responsive design
- Accessibility compliance (WCAG 2.1 AA)
- Performance optimization for fast loading
- SEO-friendly markup and structure
- Cross-browser compatibility

## File Organization
- `/css/` - Stylesheets and design files
- `/js/` - JavaScript functionality and libraries
- `/images/` - Image assets and graphics
- `/assets/` - General assets and resources

## Best Practices
- Keep HTML clean and semantic
- Use external CSS and JS files with relative paths
- Optimize images for web (WebP when possible)
- Follow accessibility guidelines
- Test across different devices and browsers
- Use progressive enhancement techniques

## Forge Forms Integration
- Use `data-forge-name` attribute on form elements to enable Forge Forms
- Each form needs unique `data-forge-name` value (e.g., "Contact Form", "Email Signup")
- Each input field can have `data-forge-name` for custom field naming
- Forms support Ajax submission, redirects, notifications, and autoresponders
- Access form data through Forge dashboard Forms tab

## URL Routing (forgerc.txt)
Forge Server configuration for clean URLs, redirects, and file exclusions:

### Basic Structure
```
[Global Rules]

[Condition] [path]
    [Rule] [arguments]
```

### Common Examples
```
# Remove trailing slashes globally
ClearLastSlash true

# Exclude files from CDN
Files
    robots.txt
    sitemap.xml
    api/data.json

# Clean URLs (remove .html extensions)
Location /about
    Rewrite /about.html

Location /contact
    Rewrite /contact.html

# External redirects
Location /terms
    Redirect https://docs.google.com/document/your-terms 302

# Direct text responses
Location /status
    Respond "Site is operational" 200

# Custom 404 page
NotFound
    Rewrite /404.html

# SPA routing (React, Vue, Angular)
NotFound
    Rewrite /index.html
```

### File Formats Supported
- `forgerc.txt` (recommended)
- `.forgerc` 
- `forgerc.json`

When generating code, ensure all suggestions follow these conventions and work with Forge's hosting platform.

# Forge + Hammer Project Guidelines for Windsurf AI

## Project Overview
This is a Forge project using the Hammer templating system for enhanced development workflow.

## Project Structure
- HTML files use Hammer tags for templating and asset management
- Source files in root directory, compiled output in /Build/
- Assets are organized in dedicated directories (/css/, /js/, /images/, /assets/)
- Build output goes to /Build/ directory (auto-generated, don't edit)

## Forge Platform Requirements
- **index.html**: Required main entry point (in source, not /Build/)
- **forgerc.txt**: Optional configuration for URL routing and file exclusions
- **Hammer Build System**: Processes templates and assets during build
- **Forms**: Use Forge Forms with `data-forge-name` attributes in templates

## Hammer Template System
- Use Hammer tags for includes and asset management
- Templates are processed during build to generate static files
- Live reload available during development

## Hammer Tag Syntax
- `<!-- @include filename.html -->` - Include content from another file
- `<!-- @path filename.ext -->` - Reference assets with automatic path resolution  
- `<!-- @stylesheet style.css -->` - Link external stylesheets
- `<!-- @javascript script.js -->` - Link external JavaScript files
- `<!-- @reload -->` - Enable live reload during development

## Development Standards
- Use semantic HTML5 elements in Hammer templates
- Mobile-first responsive design
- Accessibility compliance (WCAG 2.1 AA)
- Performance optimization for fast loading
- SEO-friendly markup and structure
- Cross-browser compatibility

## File Organization
- `/includes/` - Reusable HTML components and templates
- `/css/` - Stylesheets and design files
- `/js/` - JavaScript functionality and libraries
- `/images/` - Image assets and graphics
- `/assets/` - General assets and resources
- `/Build/` - Generated output (don't edit manually)

## Best Practices
- Keep templates modular and reusable
- Use includes for common elements (header, footer, navigation)
- Leverage Hammer's asset path resolution
- Follow accessibility guidelines in templates
- Test compiled output across different devices and browsers

## Development Workflow
- Edit source files (HTML, CSS, JS) in root directory
- Use Hammer tags for templating and asset management
- Hammer compiles everything to /Build/ directory
- Deploy /Build/ contents to Forge hosting

## URL Routing (forgerc.txt)
Same configuration as Basic Forge, with considerations for build output:

### Hammer-Specific Examples
```
# Global settings
ClearLastSlash true

# Exclude source files from CDN (keep in /Build/ only)
Files
    robots.txt
    sitemap.xml

# Clean URLs for compiled pages
Location /portfolio
    Rewrite /portfolio/index.html

Location /blog
    Rewrite /blog/index.html

# Handle both source and build paths
Location /api/contact
    Rewrite /api/contact.html
```

Note: forgerc.txt should be in project root (source), not in /Build/ directory

When generating code, ensure all suggestions follow these conventions and integrate seamlessly with existing project structure.