Zutra
A premium Astro 7 theme built for boutique real estate agencies that demand performance, design precision, and zero-compromise SEO.
Performance
Lighthouse 100/100
- Zero-JS by default with Astro 7 islands architecture
- 60+ property images optimized as WebP/AVIF at build time
- GTM and Meta Pixel offloaded to Web Workers via Partytown — core web vitals unaffected
Theme Studio PRO
Live color engine
- 5 mathematical harmony rules: Split-Complementary, Analogous, Triadic, Complementary, Monochromatic
- Real-time WCAG 2.1 AA contrast validation
- Zero-flicker persistence across page transitions
- Native-feel mobile Bottom Sheet with iOS Safe Area support
- Toggle off for production with a single flag
Maps & Filters
Interactive, no API key required
- Leaflet.js maps with ResizeObserver init — tiles always load correctly across View Transitions, Alpine reveals, and window resizes
- Show Map / Show Grid toggle on the listing page — all markers visible simultaneously with price badges
- 8-dimension filter bar: type, property type, price, beds, baths, energy rating, pets allowed, furnished — all client-side with Alpine.js
SEO & GEO
Full structured data graph
- JSON-LD per page: Organization, WebSite, RealEstateListing, GeoCoordinates, Offer, and more — all @id-linked
- Dynamic <code class="ql-font-monospace" style="background-color: rgb(38, 38, 38); color: rgb(140, 140, 140);">og:type</code> per page
- Auto sitemap on every build
- <code class="ql-font-monospace" style="background-color: rgb(38, 38, 38); color: rgb(140, 140, 140);">llms.txt</code> for AI crawlers (ChatGPT, Claude, Perplexity)
- <code class="ql-font-monospace" style="background-color: rgb(38, 38, 38); color: rgb(140, 140, 140);">robots.txt</code> with allow directives for GPTBot, CCBot, Google-Extended, anthropic-ai
Accessibility
WCAG 2.1 AA throughout
- Full <code class="ql-font-monospace" style="background-color: rgb(38, 38, 38); color: rgb(140, 140, 140);">aria-label</code>, <code class="ql-font-monospace" style="background-color: rgb(38, 38, 38); color: rgb(140, 140, 140);">aria-expanded</code>, and <code class="ql-font-monospace" style="background-color: rgb(38, 38, 38); color: rgb(140, 140, 140);">focus-visible</code> coverage
- Correct heading hierarchy on every page
- Skip-to-main link included
What's included
11 pre-built pages
- Home, Properties listing (paginated), Property detail, About/Team, Contact, Changelog, Privacy Policy, Terms of Service, 404, 500
- 25 demo properties with full markdown data
- 6 demo agents with bios and linked listings
- Similar Properties — up to 3 related listings on each detail page, ranked by commune, type, and price
- GDPR-ready cookie banner bound to gtag consent API
- Swiper.js photo galleries · PhotoSwipe lightbox
- Legal pages (Privacy Policy & Terms of Service) editable from Markdown — no code required
- One-command Cloudflare Pages deployment via <code class="ql-font-monospace" style="background-color: rgb(38, 38, 38); color: rgb(140, 140, 140);">wrangler.toml</code>
Easy rebranding
Single config file
Change agency name, colors, contact info, currency, navigation, and social links in one place: <code class="ql-font-monospace" style="background-color: rgb(38, 38, 38); color: rgb(140, 140, 140);">src/site-config.ts</code>.
