================================================================
  APERTURE — Editorial Masonry Photo Gallery
  Free Template by ShutterNoise (shutternoise.com)
================================================================

WHAT'S INCLUDED
  index.html — Your complete gallery website (single file)

QUICK START
  1. Open index.html in any text editor (VS Code, Notepad++, etc.)
  2. Make the changes below
  3. Upload to your web host
  That's it. No build tools, no npm, no frameworks.

================================================================
CUSTOMIZATION GUIDE
================================================================

BRANDING & TEXT
  Search and replace these to personalize:

  "Aperture."             → Your brand name (nav logo)
  "Where light meets"     → Your headline
  "intention"             → Your headline keyword
  "— Your Name"           → Your actual name
  "hello@yourdomain.com"  → Your email (CTA section)

SOCIAL LINKS
  Find the footer-links div. Update href="#" to your profiles:
  <a href="#">Instagram</a> → <a href="https://instagram.com/you">Instagram</a>

PHOTOS
  Each masonry-item has two image references:

  1. The <img> src — thumbnail in the grid
     Recommended: 600px wide, JPG, quality 80

  2. The data-full attribute — full-size lightbox image
     Recommended: 1400px wide, JPG, quality 85

  Example:
    BEFORE: src="https://images.unsplash.com/photo-..."
    AFTER:  src="images/my-photo.jpg"

    BEFORE: data-full="https://images.unsplash.com/photo-..."
    AFTER:  data-full="images/my-photo-full.jpg"

  Tip: Create an "images" folder next to index.html.

  Photo aspect ratios: The masonry layout LOVES mixed aspect
  ratios. Tall portraits, wide landscapes, and squares all
  look great together. Don't crop everything to the same ratio.

ADDING / REMOVING PHOTOS
  Each photo is a masonry-item div. To add more:
  1. Copy an existing masonry-item div
  2. Paste it inside the masonry div
  3. Update image src, data-full, title, location, tags
  4. Set the data-category to match your filter buttons

  To remove a photo, just delete its masonry-item div.
  The masonry layout reflows automatically.

CATEGORY FILTERS
  The filter buttons at the top filter by data-category.
  Default categories: portrait, landscape, street, editorial

  To change or add categories:
  1. Add a new filter button:
     <button class="filter-btn" data-filter="wildlife">Wildlife</button>
  
  2. Set data-category="wildlife" on matching gallery items

  3. Items can only have ONE category. Pick the primary one.

COLORS
  Find the :root section in the <style> block:

  --bg:#f5f2ed           → Page background (warm cream)
  --accent:#b85c38       → Accent color (terracotta)
  --text:#1a1815         → Main text color
  --bg-card:#fff         → Card/image background

  Popular accent alternatives:
    Terracotta:   #b85c38  (default)
    Sage:         #7d8c6e
    Navy:         #2c3e6b
    Plum:         #7a4069
    Slate:        #4a5568

  Want a DARK version? Swap these:
    --bg:#0f0f0f
    --bg-card:#1a1a1a
    --text:#e8e4df
    --text-muted:#7a756e
    --border:rgba(255,255,255,.06)

FONTS
  The template uses Google Fonts:
  - Playfair Display (headings — classic serif)
  - DM Sans (body — modern sans-serif)

  To change: visit fonts.google.com, update the <link> tag
  and the --display / --body variables in :root.

STATS BAR
  Find the stats-bar section. Update the numbers and labels
  to match your actual experience. Or delete the whole
  stats-bar section if you prefer not to show stats.

ABOUT SECTION
  Update the about-content text and replace the about-image
  src with your own photographer portrait or behind-the-scenes
  shot. The decorative offset frame effect works best with a
  3:4 vertical image.

================================================================
HOSTING
================================================================
  Static HTML — works on ANY web host:
  - GoDaddy, Bluehost, SiteGround, DreamHost
  - Netlify, Vercel, GitHub Pages (all free)
  - Any FTP upload to shared hosting

================================================================
FEATURES INCLUDED
================================================================
  ✓ CSS masonry layout (no JavaScript needed for layout)
  ✓ Working category filter buttons with smooth transitions
  ✓ Full-screen lightbox with arrow key navigation
  ✓ Scroll-triggered reveal animations
  ✓ Sticky frosted-glass navigation bar
  ✓ Hover overlays with title, location, and tags
  ✓ Mobile responsive (3 → 2 → 1 column)
  ✓ Stats bar with animated counters
  ✓ No external dependencies (except Google Fonts)
  ✓ SEO-friendly semantic HTML

================================================================
CREDITS & LICENSE
================================================================
  Free template by ShutterNoise — shutternoise.com

  You are free to:
  ✓ Use this for personal or commercial projects
  ✓ Modify it however you like
  ✓ Use it for client work

  We just ask that you:
  → Keep the "Free template by ShutterNoise" credit in the footer

  Placeholder photos from Unsplash (unsplash.com) — replace
  with your own work before publishing.

  Questions? Visit shutternoise.com
================================================================
