# Quick Funding — Python Flask Website

A fully responsive, production-ready loan broker website for Australian business, personal, and car finance.

---

## Tech Stack

- **Backend:** Python 3.10+ / Flask 3.1
- **Templating:** Jinja2 (via Flask)
- **Frontend:** Vanilla HTML/CSS/JS — no React, no build step
- **Animations:** AOS (Animate On Scroll) v2.3.4
- **Slider:** Swiper.js v11
- **Fonts:** Plus Jakarta Sans (headings) + Inter (body) via Google Fonts
- **Icons:** Inline SVG throughout — no icon font dependency

---

## Project Structure

```
aus_business_loans/
├── app.py                        # Main Flask application
├── config.py                     # App configuration
├── requirements.txt              # Python dependencies
├── run.sh                        # Quick start script
├── README.md                     # This file
│
├── forms/
│   ├── __init__.py
│   ├── calculator.py             # Loan calculator form
│   └── contact.py                # Contact form
│
├── utils/
│   ├── __init__.py
│   └── loan_math.py              # Loan repayment calculations
│
├── templates/
│   ├── base.html                 # Master layout (nav, footer, scripts)
│   ├── home.html                 # Homepage with hero slider
│   ├── business_loan.html        # Business loans page
│   ├── personal_loan.html        # Personal loans page
│   ├── car_loan.html             # Car loans page
│   ├── apply.html                # 4-step application form
│   └── calculator.html           # Standalone calculator page
│
├── static/
│   ├── css/
│   │   ├── base.css              # Global design system & all shared styles
│   │   ├── calculator.css        # Calculator widget styles
│   │   ├── home.css              # Homepage-specific styles
│   │   └── apply.css             # Apply form styles
│   │
│   ├── js/
│   │   ├── main.js               # Nav, AOS init, calculator logic, counters
│   │   ├── calculator.js         # Standalone calculator page JS
│   │   └── apply.js              # Multi-step apply form JS
│   │
│   └── img/
│       ├── logo-color.png        # Brand logo (dark backgrounds)
│       ├── logo-white.png        # Brand logo (light backgrounds)
│       ├── hero-city.jpg         # Homepage hero slide 1
│       ├── business-meeting.jpg  # Business loan hero
│       ├── business-handshake.jpg
│       ├── business-team.jpg
│       ├── office-interior.jpg   # Business loan detail section
│       ├── retail-shop.jpg       # Personal loan detail section
│       ├── car-modern.jpg        # Car loan hero + detail section
│       ├── personal-finance.jpg  # Personal loan hero
│       ├── avatar-1.jpg          # Testimonial avatar
│       ├── avatar-2.jpg          # Testimonial avatar
│       └── avatar-3.jpg          # Testimonial avatar
```

---

## Local Setup

### 1. Clone / copy the folder

```bash
cd aus_business_loans
```

### 2. Create a virtual environment

```bash
python3 -m venv venv
source venv/bin/activate        # Mac/Linux
venv\Scripts\activate           # Windows
```

### 3. Install dependencies

```bash
pip install -r requirements.txt
```

### 4. Run the development server

```bash
python app.py
```

The site will be available at:
- **Local:** http://localhost:5001
- **LAN (any device on same WiFi):** http://192.168.x.x:5001

---

## Production Deployment

### Using Gunicorn (recommended)

```bash
pip install gunicorn
gunicorn -w 4 -b 0.0.0.0:8000 app:app
```

### Using a reverse proxy (Nginx example)

```nginx
server {
    listen 80;
    server_name yourdomain.com.au;

    location / {
        proxy_pass http://127.0.0.1:8000;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
    }

    location /static {
        alias /path/to/aus_business_loans/static;
        expires 30d;
    }
}
```

### Environment Variables (optional)

| Variable | Default | Description |
|----------|---------|-------------|
| `PORT` | `5001` | Port to run on |
| `HOST` | `0.0.0.0` | Host to bind to |
| `FLASK_DEBUG` | `False` | Enable debug mode |
| `SECRET_KEY` | auto-generated | Flask secret key — set a strong value in production |

---

## Pages & Routes

| URL | Template | Description |
|-----|----------|-------------|
| `/` | `home.html` | Homepage with hero slider, products, testimonials |
| `/business-loan` | `business_loan.html` | Business loans page with calculator |
| `/personal-loan` | `personal_loan.html` | Personal loans page with calculator |
| `/car-loan` | `car_loan.html` | Car loans page with calculator |
| `/apply` | `apply.html` | 4-step application form (GET + POST) |
| `/calculator` | `calculator.html` | Standalone loan calculator |
| `/calculator/compute` | — | JSON API endpoint for loan math |

---

## Key Features

- **Fully responsive** — mobile-first, tested from 320px to 1440px
- **Hero slider** — Swiper.js 3-slide carousel with Ken Burns zoom effect
- **Live calculators** — on every product page, instant repayment estimates
- **Animated stat counters** — IntersectionObserver-driven on scroll
- **4-step apply form** — multi-step with progress bar, validation, and summary
- **Professional SVG icons** — no emoji, no icon fonts
- **AOS animations** — smooth fade-up/fade-in on scroll throughout
- **Deep navy + brand blue footer** — gradient with subtle radial glows
- **LAN accessible** — binds to 0.0.0.0 so any device on the network can view it

---

## Before Going Live — Developer Checklist

- [ ] Replace `logo-color.png` and `logo-white.png` with client's actual brand assets
- [ ] Confirm Unsplash image licensing or replace with licensed/owned images
- [ ] Set a strong `SECRET_KEY` in environment variables
- [ ] Wire up the `/apply` POST handler to a real CRM, email service (e.g. SendGrid), or database
- [ ] Update phone number, email, ABN, ACL number, and address in `base.html` and templates
- [ ] Add SSL certificate (Let's Encrypt is free) before launch
- [ ] Set `FLASK_DEBUG=False` in production
- [ ] Configure Nginx/Apache as reverse proxy in front of Gunicorn
- [ ] Set up proper logging and error monitoring (e.g. Sentry)

---

## Contact / Handover

Built with Python Flask. No proprietary frameworks, no paid plugins, no build tools required.
All styling is plain CSS with custom properties — easy to theme by editing the variables at the top of `static/css/base.css`.

---

*Quick Funding Pty Ltd — ABN 76 607 702 607 — ACL 389328*
