916 lines
69 KiB
XML

<?xml version="1.0" encoding="utf-8"?>
<odoo>
<!-- Create the About Us website page record -->
<record id="aboutus_page" model="website.page">
<field name="name">About Us</field>
<field name="url">/aboutus</field>
<field name="is_published">True</field>
<field name="view_id" ref="website.aboutus"/>
<field name="track">True</field>
</record>
<!-- Inherit and Override Catalog Page -->
<template id="rental_catalog_template_inherit" inherit_id="event_rental.rental_catalog_template">
<xpath expr="//div[@id='wrap']" position="replace">
<div id="wrap" class="oe_structure oe_empty tailwind-wrapper bg-cream" style="background-color: #fcf6e9;">
<main class="flex-1">
<section class="mx-auto max-w-6xl px-6 py-12">
<p class="mb-4 text-xs uppercase tracking-[0.4em] text-gold">Rental Collection</p>
<h1 class="font-serif text-5xl text-navy md:text-6xl mb-6">Our Event Rental Products</h1>
<p class="mt-2 max-w-2xl text-muted-foreground mb-12">Browse our premium collection of event rental items to elevate your special occasion.</p>
<div class="row">
<!-- Category Sidebar -->
<div class="col-md-3 mb-4">
<div class="bg-card rounded-xl border border-border/60 p-4 shadow-sm">
<h5 class="font-serif text-xl text-navy mb-4" style="border-bottom: 2px solid #d4a14a; padding-bottom: 8px;">Categories</h5>
<div class="list-group list-group-flush" style="background: transparent;">
<a t-att-href="'/rentals' + (search and ('?search=' + search) or '')"
t-att-class="'list-group-item list-group-item-action border-0 px-2 py-2 rounded font-medium ' + (not current_category and 'bg-navy text-cream' or 'text-navy hover:bg-navy/5 bg-transparent')"
style="transition: all 0.2s; text-decoration: none;">
All Products
</a>
<t t-foreach="categories" t-as="cat">
<a t-att-href="'/rentals?category=' + str(cat.id) + (search and ('&amp;search=' + search) or '')"
t-att-class="'list-group-item list-group-item-action border-0 px-2 py-2 rounded font-medium mt-1 ' + (current_category == cat.id and 'bg-navy text-cream' or 'text-navy hover:bg-navy/5 bg-transparent')"
style="transition: all 0.2s; text-decoration: none;">
<span t-field="cat.name"/>
</a>
</t>
</div>
</div>
</div>
<!-- Products Section -->
<div class="col-md-9">
<!-- Search and Filter Area -->
<div class="mb-6">
<form action="/rentals" method="get" class="flex gap-2">
<input type="hidden" name="category" t-att-value="current_category" t-if="current_category"/>
<input type="text" name="search" class="form-control flex-1 px-4 py-2 border border-border rounded-lg bg-white focus:outline-none focus:ring-2 focus:ring-gold" placeholder="Search rental products..." t-att-value="search"/>
<button type="submit" class="btn bg-navy text-cream hover:bg-navy/90 px-6 py-2 rounded-lg font-medium shadow-sm transition-colors" style="color: #fcf6e9; border: none;">Search</button>
</form>
</div>
<!-- Empty state -->
<div class="text-center py-16 bg-card rounded-xl border border-border/60 shadow-sm" t-if="not products">
<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="#d4a14a" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="mx-auto mb-4"><circle cx="12" cy="12" r="10"/><path d="m15 9-6 6"/><path d="m9 9 6 6"/></svg>
<h3 class="font-serif text-2xl text-navy mb-2">No Products Found</h3>
<p class="text-muted-foreground text-sm">We couldn't find any rental products matching your filters.</p>
<a href="/rentals" class="mt-4 inline-block text-gold underline text-sm font-semibold">Clear Filters</a>
</div>
<!-- Product Grid -->
<div class="row" t-if="products">
<t t-foreach="products" t-as="product">
<div class="col-md-4 col-sm-6 mb-4">
<div class="group flex flex-col h-100 rounded-xl border border-border/60 bg-card transition-shadow hover:shadow-lg overflow-hidden">
<!-- Product Image -->
<div class="relative overflow-hidden bg-slate-100" style="height: 200px;">
<img t-if="product.image_1920" t-att-src="image_data_uri(product.image_1920)" class="w-100 h-100 object-cover transition-transform duration-500 group-hover:scale-105" loading="lazy"/>
<div t-else="" class="d-flex align-items-center justify-content-center h-100 text-muted bg-slate-50">
<i class="fa fa-picture-o fa-3x text-slate-300"></i>
</div>
</div>
<!-- Product Details -->
<div class="p-4 d-flex flex-column flex-grow-1">
<h3 class="font-serif text-lg text-navy font-bold mb-2 group-hover:text-gold transition-colors" t-field="product.name"/>
<p class="text-sm text-muted-foreground leading-relaxed flex-grow-1 mb-4" t-field="product.description_sale" style="display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;"/>
<div class="mt-auto pt-3 border-t border-border/40 d-flex justify-content-between align-items-center">
<div>
<span class="font-serif text-lg text-navy font-bold" t-field="product.rental_price_per_day" t-options="{'widget': 'monetary', 'display_currency': res_company.currency_id}"/>
<span class="text-xs text-muted-foreground block">/ day</span>
</div>
<a t-att-href="'/rentals/%s' % slug(product)" class="inline-flex items-center justify-center font-medium cursor-pointer transition-colors px-3 py-1.5 text-xs bg-navy text-cream hover:bg-navy/90 rounded-md shadow-sm" style="color: #fcf6e9; text-decoration: none;">
View Details
</a>
</div>
</div>
</div>
</div>
</t>
</div>
</div>
</div>
</section>
</main>
</div>
</xpath>
</template>
<!-- Inherit and Override Product Detail Page -->
<template id="rental_product_detail_template_inherit" inherit_id="event_rental.rental_product_detail_template">
<xpath expr="//div[@id='wrap']" position="replace">
<style>
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&amp;family=Outfit:wght@300;400;500;600;700;800&amp;family=Playball&amp;display=swap');
#wrap {
background-color: #fcf6e9 !important;
font-family: 'Inter', sans-serif !important;
}
h1, h2, h3, h4, h5, h6 {
font-family: 'Outfit', sans-serif !important;
font-weight: 700;
color: #0f172a;
}
.aakriti-cursive {
font-family: 'Playball', cursive !important;
color: #d4a14a !important;
}
.breadcrumb-link {
color: #0b223e;
font-weight: 500;
}
.detail-card {
background: #ffffff;
border: 1px solid #EAE5E8;
border-radius: 16px;
box-shadow: 0 4px 25px rgba(113, 75, 103, 0.02);
}
.detail-price {
font-size: 2.5rem;
font-weight: 800;
color: #0b223e;
}
.detail-action-btn {
border-radius: 30px !important;
background-color: #0b223e !important;
border: none !important;
padding: 16px 24px !important;
font-weight: 700;
letter-spacing: 0.5px;
font-size: 1rem;
transition: all 0.3s ease;
}
.detail-action-btn:hover {
background-color: #061528 !important;
transform: translateY(-2px);
box-shadow: 0 6px 18px rgba(113, 75, 103, 0.3) !important;
}
.terms-title {
font-size: 1.4rem;
border-left: 4px solid #d4a14a;
padding-left: 12px;
color: #0b223e;
}
</style>
<div id="wrap" class="py-5">
<div class="container">
<div class="row">
<!-- Product Gallery -->
<div class="col-md-6 mb-4">
<div class="detail-card p-3">
<div style="height: 450px; overflow: hidden; border-radius: 10px; background-color: #f1f5f9;">
<img t-if="product.image_1920" t-att-src="image_data_uri(product.image_1920)" class="w-100 h-100" style="object-fit: cover;"/>
<div t-else="" class="d-flex align-items-center justify-content-center h-100 text-muted bg-light">
<i class="fa fa-picture-o fa-5x"></i>
</div>
</div>
</div>
</div>
<!-- Product Purchase Details -->
<div class="col-md-6">
<div class="detail-card p-4 p-md-5 h-100 d-flex flex-column">
<nav aria-label="breadcrumb">
<ol class="breadcrumb bg-transparent p-0 mb-4" style="font-size: 0.85rem;">
<li class="breadcrumb-item"><a href="/rentals" class="breadcrumb-link">Collections</a></li>
<li class="breadcrumb-item active text-muted" aria-current="page">
<span t-field="product.name"/>
</li>
</ol>
</nav>
<span class="aakriti-cursive mb-1 d-block" style="font-size: 1.5rem;">Bespoke Design Collection</span>
<h1 class="display-5 mb-3" style="font-size: 2.2rem;" t-field="product.name"/>
<div class="mb-4">
<span t-if="product.qty_available &gt; 0" class="badge badge-pill badge-success p-2 px-3" style="background-color: #28a745; font-size: 0.8rem; font-weight: 600;">In Stock &amp; Available</span>
<span t-else="" class="badge badge-pill badge-warning p-2 px-3" style="font-size: 0.8rem; font-weight: 600;">Custom Order - Checking Dates</span>
</div>
<div class="my-4 py-3 border-top border-bottom d-flex align-items-baseline">
<span class="detail-price">
<span t-field="product.rental_price_per_day" t-options="{'widget': 'monetary', 'display_currency': res_company.currency_id}"/>
</span>
<span class="text-muted ml-2 font-weight-normal lead" style="font-size: 1.15rem;">/ Day</span>
</div>
<h5 class="font-weight-bold mb-2" style="font-size: 1rem; text-transform: uppercase; letter-spacing: 0.5px; color: #0b223e;">Product Description</h5>
<p class="text-muted mb-5" style="line-height: 1.6; font-size: 0.95rem;" t-field="product.description_sale"/>
<div class="mt-auto">
<a t-att-href="'/rental/request?product_id=%s' % product.product_variant_id.id" class="btn btn-primary btn-lg btn-block detail-action-btn shadow-sm">
Request Booking Quotation
</a>
</div>
</div>
</div>
</div>
<div class="row mt-5" t-if="product.rental_terms">
<div class="col-12">
<div class="detail-card p-5 bg-white">
<h4 class="font-weight-bold terms-title mb-4">RESERVATION TERMS &amp; GENERAL POLICIES</h4>
<div class="text-muted" style="line-height: 1.7; font-size: 0.95rem;" t-field="product.rental_terms"/>
</div>
</div>
</div>
</div>
</div>
</xpath>
</template>
<!-- Inherit and Override Request Form Template -->
<template id="rental_request_form_template_inherit" inherit_id="event_rental.rental_request_form_template">
<xpath expr="//div[@id='wrap']" position="replace">
<style>
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&amp;family=Outfit:wght@300;400;500;600;700;800&amp;family=Playball&amp;display=swap');
#wrap {
background-color: #fcf6e9 !important;
font-family: 'Inter', sans-serif !important;
}
h2, h4, h5 {
font-family: 'Outfit', sans-serif !important;
font-weight: 700;
color: #0f172a;
}
.aakriti-cursive {
font-family: 'Playball', cursive !important;
color: #d4a14a !important;
}
.form-container {
background: #ffffff;
border: 1px solid #EAE5E8;
border-radius: 20px;
box-shadow: 0 4px 30px rgba(113, 75, 103, 0.03);
}
.section-header {
color: #0b223e;
border-left: 4px solid #d4a14a;
padding-left: 12px;
font-size: 1.15rem;
font-weight: 700;
letter-spacing: 0.5px;
text-transform: uppercase;
}
.form-control {
border-radius: 8px !important;
border: 1.5px solid #EAE5E8 !important;
padding: 12px 16px !important;
font-size: 0.95rem !important;
transition: all 0.2s ease;
}
.form-control:focus {
border-color: #0b223e !important;
box-shadow: 0 0 0 3px rgba(113, 75, 103, 0.1) !important;
}
.form-group label {
font-weight: 600;
color: #334155;
font-size: 0.9rem;
margin-bottom: 6px;
}
.submit-btn {
border-radius: 30px !important;
background-color: #0b223e !important;
border: none !important;
padding: 16px 24px !important;
font-weight: 700;
letter-spacing: 0.5px;
font-size: 1.05rem;
transition: all 0.3s ease;
}
.submit-btn:hover {
background-color: #061528 !important;
transform: translateY(-2px);
box-shadow: 0 6px 18px rgba(113, 75, 103, 0.3) !important;
}
.upload-box {
border: 2px dashed #d4a14a;
padding: 20px;
border-radius: 12px;
background: #fcf6e9;
text-align: center;
transition: all 0.2s ease;
}
</style>
<div id="wrap" class="py-5">
<div class="container col-lg-8 col-md-10">
<div class="form-container p-4 p-md-5 bg-white">
<div class="text-center mb-5">
<span class="aakriti-cursive d-block" style="font-size: 1.8rem;">Let's Design Together</span>
<h2 class="display-5" style="font-size: 2rem;">Inquire About Your Event</h2>
<p class="text-muted" style="max-width: 600px; margin: 8px auto 0; font-size: 0.95rem;">Enter details below to submit your inquiry. Our reservations engine will instantly generate an itemized quote.</p>
</div>
<!-- Error Alert -->
<div class="alert alert-danger p-3 mb-4" role="alert" style="border-radius: 10px;" t-if="error_message">
<i class="fa fa-exclamation-circle mr-2"></i> <t t-out="error_message"/>
</div>
<form action="/rental/request" method="post" enctype="multipart/form-data">
<input type="hidden" name="csrf_token" t-att-value="request.csrf_token()"/>
<!-- Customer Details -->
<h5 class="section-header mb-4">1. Customer Information</h5>
<div class="row">
<div class="form-group col-md-6 mb-3">
<label for="customer_name">Full Name <span class="text-danger">*</span></label>
<input type="text" name="customer_name" id="customer_name" class="form-control" required="1" t-att-value="post.get('customer_name', '')"/>
</div>
<div class="form-group col-md-6 mb-3">
<label for="customer_email">Email Address <span class="text-danger">*</span></label>
<input type="email" name="customer_email" id="customer_email" class="form-control" required="1" t-att-value="post.get('customer_email', '')"/>
</div>
</div>
<div class="row">
<div class="form-group col-md-6 mb-3">
<label for="customer_phone">Mobile Number <span class="text-danger">*</span></label>
<input type="tel" name="customer_phone" id="customer_phone" class="form-control" required="1" t-att-value="post.get('customer_phone', '')"/>
</div>
<div class="form-group col-md-6 mb-3">
<label for="company_name">Company Name <span class="text-muted">(Optional)</span></label>
<input type="text" name="company_name" id="company_name" class="form-control" t-att-value="post.get('company_name', '')"/>
</div>
</div>
<div class="form-group mb-4">
<label for="customer_address">Full Delivery Address</label>
<textarea name="customer_address" id="customer_address" rows="2" class="form-control" placeholder="Provide complete delivery address..."><t t-out="post.get('customer_address', '')"/></textarea>
</div>
<hr class="my-4" style="border-top: 1px solid #eef2f7;"/>
<!-- Event Details -->
<h5 class="section-header mb-4">2. Event &amp; Schedule Details</h5>
<div class="row">
<div class="form-group col-md-6 mb-3">
<label for="start_date">Rental Start Date &amp; Time <span class="text-danger">*</span></label>
<input type="datetime-local" name="start_date" id="start_date" class="form-control" required="1" t-att-value="post.get('start_date', '')"/>
</div>
<div class="form-group col-md-6 mb-3">
<label for="end_date">Rental End Date &amp; Time <span class="text-danger">*</span></label>
<input type="datetime-local" name="end_date" id="end_date" class="form-control" required="1" t-att-value="post.get('end_date', '')"/>
</div>
</div>
<div class="row">
<div class="form-group col-md-6 mb-3">
<label for="location">Event Venue Location <span class="text-danger">*</span></label>
<input type="text" name="location" id="location" class="form-control" required="1" t-att-value="post.get('location', '')" placeholder="City or Venue Hall name"/>
</div>
<div class="form-group col-md-6 mb-3">
<label for="event_type">Event Type <span class="text-danger">*</span></label>
<select name="event_type" id="event_type" class="form-control" required="1">
<option value="wedding" t-att-selected="post.get('event_type') == 'wedding'">Wedding</option>
<option value="birthday" t-att-selected="post.get('event_type') == 'birthday'">Birthday</option>
<option value="corporate" t-att-selected="post.get('event_type') == 'corporate'">Corporate Event</option>
<option value="stage" t-att-selected="post.get('event_type') == 'stage'">Stage Setup</option>
<option value="festival" t-att-selected="post.get('event_type') == 'festival'">Festival</option>
<option value="exhibition" t-att-selected="post.get('event_type') == 'exhibition'">Exhibition</option>
<option value="other" t-att-selected="post.get('event_type') == 'other' or not post.get('event_type')">Other</option>
</select>
</div>
</div>
<hr class="my-4" style="border-top: 1px solid #eef2f7;"/>
<!-- Product Details -->
<h5 class="section-header mb-4">3. Rental Item Selected</h5>
<div class="row">
<div class="form-group col-md-12 mb-3">
<label for="product_id">Selected Product / Service <span class="text-danger">*</span></label>
<select name="product_id" id="product_id" class="form-control" required="1">
<t t-foreach="all_products" t-as="prod">
<option t-att-value="prod.id" t-att-selected="(selected_product and selected_product.id == prod.id) or (post.get('product_id') == str(prod.id))">
<t t-out="prod.display_name"/>
</option>
</t>
</select>
</div>
</div>
<hr class="my-4" style="border-top: 1px solid #eef2f7;"/>
<!-- Document Upload -->
<h5 class="section-header mb-4">4. Document Verification</h5>
<div class="row">
<div class="form-group col-md-6 mb-3">
<label for="doc_type">Government ID Proof <span class="text-danger">*</span></label>
<select name="doc_type" id="doc_type" class="form-control" required="1">
<option value="aadhaar" t-att-selected="post.get('doc_type') == 'aadhaar'">Aadhaar Card</option>
<option value="driving_license" t-att-selected="post.get('doc_type') == 'driving_license'">Driving License</option>
<option value="passport" t-att-selected="post.get('doc_type') == 'passport'">Passport</option>
<option value="voter_id" t-att-selected="post.get('doc_type') == 'voter_id'">Voter ID</option>
</select>
</div>
<div class="form-group col-md-6 mb-3">
<label class="d-block mb-2">Upload File (PDF, JPG, PNG) <span class="text-danger">*</span></label>
<div class="upload-box">
<i class="fa fa-cloud-upload fa-2x text-brand-plum mb-2"></i>
<input type="file" name="id_proof" id="id_proof" class="form-control-file d-block mx-auto" accept=".pdf,.jpg,.jpeg,.png" required="1" style="font-size: 0.85rem; max-width: 200px;"/>
</div>
</div>
</div>
<button type="submit" class="btn btn-primary btn-lg btn-block submit-btn mt-4 shadow-sm">
Submit Rental Request
</button>
</form>
</div>
</div>
</div>
</xpath>
</template>
<!-- Inherit and Override Success Confirmation Page -->
<template id="rental_request_success_template_inherit" inherit_id="event_rental.rental_request_success_template">
<xpath expr="//div[@id='wrap']" position="replace">
<style>
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&amp;family=Outfit:wght@300;400;500;600;700;800&amp;family=Playball&amp;display=swap');
#wrap {
background-color: #fcf6e9 !important;
font-family: 'Inter', sans-serif !important;
}
h2, h4 {
font-family: 'Outfit', sans-serif !important;
font-weight: 700;
}
.success-card {
background: #ffffff;
border: 1px solid #EAE5E8;
border-radius: 20px;
box-shadow: 0 4px 30px rgba(113, 75, 103, 0.03);
text-align: center;
}
.reference-badge {
padding: 12px 20px;
background-color: #eef2f7;
border-radius: 30px;
display: inline-block;
border: 1px dashed #d4a14a;
}
.success-icon {
color: #d4a14a;
}
</style>
<div id="wrap" class="py-5">
<div class="container text-center">
<div class="success-card p-5 col-lg-6 col-md-8 mx-auto bg-white">
<div class="mb-4">
<i class="fa fa-envelope-o fa-5x success-icon"></i>
</div>
<h2 class="display-5 text-brand-plum mb-3" style="font-size: 2rem;">Inquiry Registered!</h2>
<p class="lead text-muted mb-4" style="font-size: 1rem;">We have successfully registered your event rental inquiry in our booking database.</p>
<div class="reference-badge mb-4">
<span class="text-muted" style="font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.5px;">Reference Number</span><br/>
<h4 class="font-weight-bold text-brand-plum mb-0 mt-1" t-out="name"/>
</div>
<p class="text-muted mb-4" style="font-size: 0.9rem; line-height: 1.6;">Our operations team is evaluating real-time stock allocations. You will receive an email and WhatsApp message shortly with a portal checkout link to review and pay the quotation.</p>
<a href="/rentals" class="btn btn-primary bg-brand-plum border-0 py-2 px-5 font-weight-bold shadow-sm" style="border-radius: 30px; font-size: 0.95rem;">Back to Catalog</a>
</div>
</div>
</div>
</xpath>
</template>
<!-- Inherit and Override Homepage to match events.aakritidesign.com -->
<template id="theme_aakriti_events_homepage" inherit_id="website.homepage" active="True" customize_show="False">
<xpath expr="//div[@id='wrap']" position="replace">
<div id="wrap" class="oe_structure oe_empty tailwind-wrapper bg-cream" style="background-color: #fcf6e9;">
<main class="flex-1">
<section class="relative overflow-hidden" style="border-bottom: 1px solid #e0d6c6;">
<div class="pointer-events-none absolute inset-0 -z-10">
<div class="absolute -right-32 top-10 h-[420px] w-[420px] rounded-full bg-gold-soft/40 blur-3xl"></div>
<div class="absolute -left-40 top-1/3 h-[360px] w-[360px] rounded-full bg-sage/15 blur-3xl"></div>
</div>
<div class="mx-auto grid max-w-6xl gap-12 px-6 pt-24 pb-20 md:grid-cols-[1.1fr_1fr] md:items-center md:gap-16 md:pt-32 md:pb-28">
<div>
<p class="mb-6 text-xs uppercase tracking-[0.4em] text-gold" style="margin-bottom: 1.5rem;">Aakriti Design · with Parul</p>
<h1 class="font-serif text-5xl leading-[1.05] text-navy md:text-6xl lg:text-7xl" style="margin:0;">
Vastu Consultations for Spaces that hold you,<br/>
<span style="font-family: 'Playfair Display', Georgia, serif; font-style: italic; font-weight: 400; color: #d4a14a; letter-spacing: 0.01em;">gently and well.</span>
</h1>
<p class="mt-8 max-w-xl text-lg text-muted-foreground" style="margin-top: 2rem;">Personal Vastu consultations for homes, businesses, and wellness spaces - guidance that feels modern, grounded, and quietly transformative.</p>
<div class="mt-10 flex flex-wrap gap-4" style="margin-top: 2.5rem;">
<a href="/rental/request" class="inline-flex items-center justify-center gap-2 whitespace-nowrap text-sm font-medium cursor-pointer transition-colors shadow rounded-md h-12 bg-navy px-7 text-cream hover:bg-navy/90" style="color: #fcf6e9;">
Book a Vastu Consultation
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-right ml-2 h-4 w-4" aria-hidden="true"><path d="M5 12h14"></path><path d="m12 5 7 7-7 7"></path></svg>
</a>
<a href="/rentals" class="inline-flex items-center justify-center gap-2 whitespace-nowrap text-sm font-medium cursor-pointer transition-colors border shadow-sm rounded-md h-12 border-navy/30 px-7 text-navy hover:bg-navy/5">
Explore services
</a>
</div>
</div>
<div class="relative">
<div class="absolute -inset-4 -z-10 rounded-3xl bg-gradient-to-br from-gold-soft/40 to-sage/15 blur-2xl"></div>
<img alt="Aakriti Design - Create a space that supports your life." class="w-full rounded-2xl shadow-2xl ring-1 ring-navy/10" loading="eager" src="/theme_aakriti_events/static/src/img/vastu-poster.png"/>
<!-- Injected text over image as in previous step if desired, or just image -->
<!-- <div style="position: absolute; top: 10%; left: 0; width: 100%; text-align: center;">
<h3 class="font-serif" style="color: #0b223e; font-size: 2.5rem; margin: 0; font-weight: 400;">Create a space</h3>
<h3 class="font-serif" style="color: #5a5a5a; font-size: 2rem; font-style: italic; font-weight: 400; margin: 0;">that supports your life.</h3>
<p style="color: #0b223e; font-size: 0.9rem; letter-spacing: 1px; margin-top: 20px;">Aligned for modern living.</p>
</div> -->
<!-- <div style="position: absolute; bottom: 20px; left: 20px; right: 20px; display: flex; justify-content: space-between; background: rgba(252, 246, 233, 0.95); padding: 15px; border-radius: 10px;">
<div class="flex items-center">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#d4a14a" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="mr-3 h-6 w-6"><path d="M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2"></path><circle cx="12" cy="7" r="4"></circle></svg>
<span style="font-size: 0.85rem; color: #0b223e; line-height: 1.4;">Vastu Consultations<br/>in person and online</span>
</div>
<div class="flex flex-col justify-center text-right" style="font-size: 0.85rem; color: #0b223e; line-height: 1.6;">
<span class="flex items-center justify-end"><svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="#d4a14a" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="mr-2"><rect width="20" height="16" x="2" y="4" rx="2"></rect><path d="m22 7-8.97 5.7a1.94 1.94 0 0 1-2.06 0L2 7"></path></svg>info@aakritidesign.com</span>
<span class="flex items-center justify-end"><svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="#d4a14a" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="mr-2"><path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z"></path></svg>DM or WhatsApp 647 284 1811</span>
</div>
</div> -->
<!-- <div style="position: absolute; bottom: -20px; left: 50%; transform: translateX(-50%); width: 80px; height: 80px; background: #fcf6e9; border-radius: 50%; border: 1px solid #d4a14a; display: flex; align-items: center; justify-content: center; flex-direction: column;">
<span style="font-family: 'Playfair Display', serif; font-size: 1.8rem; color: #d4a14a; line-height: 1;">AD</span>
</div> -->
</div>
</div>
</section>
<section style="background-color: #fefaef; border-top: 1px solid #e0d6c6; border-bottom: 1px solid #e0d6c6;">
<div class="mx-auto max-w-6xl px-6 py-20">
<div class="mb-14 max-w-2xl">
<p class="mb-3 text-xs uppercase tracking-[0.3em] text-gold" style="margin-bottom: 0.75rem;">What I offer</p>
<h2 class="font-serif text-4xl text-navy md:text-5xl" style="margin: 0;">Five ways to bring your space into balance</h2>
</div>
<div class="grid gap-px overflow-hidden rounded-xl border border-border/60 bg-border/60 md:grid-cols-2 lg:grid-cols-3">
<div class="group bg-cream p-8 transition-colors hover:bg-card">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-house mb-5 h-7 w-7 text-gold" aria-hidden="true" style="margin-bottom: 1.25rem;"><path d="M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8"></path><path d="M3 10a2 2 0 0 1 .709-1.528l7-6a2 2 0 0 1 2.582 0l7 6A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path></svg>
<h3 class="mb-2 font-serif text-2xl text-navy" style="margin: 0 0 0.5rem 0;">Vastu for Homes</h3>
<p class="text-sm leading-relaxed text-muted-foreground" style="margin: 0;">Bring harmony, ease, and grounded energy to the rooms you live in.</p>
</div>
<div class="group bg-cream p-8 transition-colors hover:bg-card">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-briefcase mb-5 h-7 w-7 text-gold" aria-hidden="true" style="margin-bottom: 1.25rem;"><path d="M16 20V4a2 2 0 0 0-2-2h-4a2 2 0 0 0-2 2v16"></path><rect width="20" height="14" x="2" y="6" rx="2"></rect></svg>
<h3 class="mb-2 font-serif text-2xl text-navy" style="margin: 0 0 0.5rem 0;">Business Vastu</h3>
<p class="text-sm leading-relaxed text-muted-foreground" style="margin: 0;">Align your workspace for growth, clarity, and steady prosperity.</p>
</div>
<div class="group bg-cream p-8 transition-colors hover:bg-card">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles mb-5 h-7 w-7 text-gold" aria-hidden="true" style="margin-bottom: 1.25rem;"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"></path><path d="M20 2v4"></path><path d="M22 4h-4"></path><circle cx="4" cy="20" r="2"></circle></svg>
<h3 class="mb-2 font-serif text-2xl text-navy" style="margin: 0 0 0.5rem 0;">Wellness Spaces</h3>
<p class="text-sm leading-relaxed text-muted-foreground" style="margin: 0;">Create healing environments for studios, clinics, and retreats.</p>
</div>
<div class="group bg-cream p-8 transition-colors hover:bg-card">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-flame mb-5 h-7 w-7 text-gold" aria-hidden="true" style="margin-bottom: 1.25rem;"><path d="M12 3q1 4 4 6.5t3 5.5a1 1 0 0 1-14 0 5 5 0 0 1 1-3 1 1 0 0 0 5 0c0-2-1.5-3-1.5-5q0-2 2.5-4"></path></svg>
<h3 class="mb-2 font-serif text-2xl text-navy" style="margin: 0 0 0.5rem 0;">Altar Placement</h3>
<p class="text-sm leading-relaxed text-muted-foreground" style="margin: 0;">Honour your sacred corner with thoughtful, intentional placement.</p>
</div>
<div class="group bg-cream p-8 transition-colors hover:bg-card">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-compass mb-5 h-7 w-7 text-gold" aria-hidden="true" style="margin-bottom: 1.25rem;"><circle cx="12" cy="12" r="10"></circle><path d="m16.24 7.76-1.804 5.411a2 2 0 0 1-1.265 1.265L7.76 16.24l1.804-5.411a2 2 0 0 1 1.265-1.265z"></path></svg>
<h3 class="mb-2 font-serif text-2xl text-navy" style="margin: 0 0 0.5rem 0;">Energy Balancing</h3>
<p class="text-sm leading-relaxed text-muted-foreground" style="margin: 0;">Subtle remedies - colour, element, light - that shift how a space feels.</p>
</div>
<div class="bg-navy p-8 text-cream">
<p class="text-xs uppercase tracking-[0.3em] text-gold-soft" style="margin: 0;">Begin</p>
<h3 class="mt-4 font-serif text-2xl text-cream" style="margin: 1rem 0 0 0; color: #fcf6e9;">Start with a conversation</h3>
<p class="mt-2 text-sm leading-relaxed text-cream/70" style="margin: 0.5rem 0 0 0; color: rgba(252, 246, 233, 0.7);">Tell me about your space - I'll guide you to the right session.</p>
<a href="/rental/request" class="mt-6 inline-flex items-center gap-2 text-sm hover:gap-3 transition-all" style="margin-top: 1.5rem; color: #d4a14a;" onmouseover="this.style.color='#d4a14a'" onmouseout="this.style.color='#d4a14a'">
Book a consultation
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-right h-4 w-4" aria-hidden="true"><path d="M5 12h14"></path><path d="m12 5 7 7-7 7"></path></svg>
</a>
</div>
</div>
</div>
</section>
<section class="mx-auto max-w-4xl px-6 py-24 text-center" style="background-color: #fcf6e9;">
<p class="mb-4 text-xs uppercase tracking-[0.3em] text-gold" style="margin-bottom: 1rem;">Meet Parul</p>
<h2 class="font-serif text-4xl text-navy md:text-5xl" style="margin: 0;">&#8220;A balanced space is the quietest kind of luxury.&#8221;</h2>
<p class="mx-auto mt-8 max-w-2xl text-muted-foreground" style="margin-top: 2rem;">I bring a calm, modern lens to Vastu - pairing traditional principles with how you actually live and work today. Every consultation is tailored, kind, and deeply practical.</p>
<div class="mt-8" style="margin-top: 2rem;">
<a href="/aboutus" class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium cursor-pointer underline-offset-4 hover:underline h-9 px-4 py-2 text-gold">Read more about Parul &#8594;</a>
</div>
</section>
<section class="border-t border-border/60 bg-navy">
<div class="mx-auto max-w-5xl px-6 py-20 text-center text-cream">
<h2 class="font-serif text-4xl md:text-5xl" style="margin: 0; color: #fcf6e9;">Ready to begin?</h2>
<p class="mx-auto mt-4 max-w-xl text-cream/70" style="margin-top: 1rem; color: rgba(252, 246, 233, 0.7);">Book a session online or in person, and receive a personalised report with clear, actionable recommendations.</p>
<a href="/rental/request" class="inline-flex items-center justify-center gap-2 whitespace-nowrap text-sm font-medium cursor-pointer shadow rounded-md mt-8 h-12 bg-gold px-8 text-navy hover:bg-gold/90" style="margin-top: 2rem; color: #0b223e;">Book a Vastu Consultation</a>
</div>
</section>
</main>
</div>
</xpath>
</template>
<!-- Tailwind CSS Injection -->
<template id="theme_aakriti_events_tailwind" inherit_id="website.layout">
<xpath expr="//head" position="inside">
<script src="https://cdn.tailwindcss.com"></script>
<script>
tailwind.config = {
corePlugins: {
preflight: false,
},
theme: {
extend: {
colors: {
navy: '#0b223e',
cream: '#fcf6e9',
gold: '#d4a14a',
'gold-soft': '#d8b47d',
sage: '#8a9a86',
border: '#e5e7eb',
muted: { foreground: '#6b7280' },
card: '#fefaef',
background: '#fcf6e9'
},
fontFamily: {
serif: ['"Playfair Display"', 'serif'],
sans: ['Inter', 'sans-serif'],
}
}
}
}
</script>
<style>
/* Add minimal preflight for Tailwind inside the specific wrapper since we disabled global preflight */
.tailwind-wrapper h1, .tailwind-wrapper h2, .tailwind-wrapper h3, .tailwind-wrapper h4, .tailwind-wrapper p {
margin: 0;
}
.tailwind-wrapper a {
text-decoration: none;
}
/* Lock text color on hover - prevent Odoo's global a:hover from overriding */
.tailwind-wrapper a[style*="color: #d4a14a"]:hover,
.tailwind-wrapper a.text-gold:hover {
color: #d4a14a !important;
}
/* Navy buttons: keep cream text on hover */
.tailwind-wrapper a.bg-navy:hover,
.tailwind-wrapper a[style*="background-color: #0b223e"]:hover {
color: #fcf6e9 !important;
}
/* Cream buttons with navy text: keep navy on hover */
.tailwind-wrapper a.text-navy:hover {
color: #0b223e !important;
}
/* Any link with explicit inline color: keep it on hover */
.tailwind-wrapper a[style*="color:"]:hover {
color: inherit;
}
.tailwind-wrapper img {
max-width: 100%;
height: auto;
}
</style>
</xpath>
</template>
<!-- Inherit Website Layout to Override Header & Footer -->
<template id="theme_aakriti_events_header_inherit" inherit_id="website.layout" priority="99">
<!-- Header Override -->
<xpath expr="//header" position="replace">
<!-- Fix horizontal scroll caused by off-screen fixed drawer -->
<style>
html, body { overflow-x: hidden !important; }
@media (min-width: 768px) {
#mobileDrawer, #mobileDrawerOverlay { display: none !important; }
}
</style>
<header class="sticky top-0 z-40 backdrop-blur-md tailwind-wrapper" id="top" data-anchor="true" style="background-color: rgba(252, 246, 233, 0.92); border-bottom: 1px solid #e0d6c6;">
<div class="mx-auto flex h-20 max-w-6xl items-center justify-between px-6">
<a class="group inline-flex items-center gap-3 active" href="/" data-status="active" aria-current="page">
<img alt="Aakriti Design" class="h-12 w-12 object-contain transition-transform duration-700 group-hover:rotate-6" src="/theme_aakriti_events/static/src/img/logo-aakriti.ico"/>
<span class="flex flex-col leading-none">
<span class="font-serif text-xl text-navy">Aakriti Design</span>
<span class="text-[10px] uppercase tracking-[0.25em] text-muted-foreground">Vastu Consultation</span>
</span>
</a>
<nav class="hidden items-center gap-8 md:flex">
<a t-attf-class="text-sm font-medium transition-colors hover:text-gold #{'text-gold' if request.httprequest.path == '/' else 'text-navy/80'}" t-attf-style="#{'color: #d4a14a; font-weight: 600;' if request.httprequest.path == '/' else ''}" href="/">Home</a>
<a t-attf-class="text-sm font-medium transition-colors hover:text-gold #{'text-gold' if request.httprequest.path == '/rentals' else 'text-navy/80'}" t-attf-style="#{'color: #d4a14a; font-weight: 600;' if request.httprequest.path == '/rentals' else ''}" href="/rentals">Services</a>
<a t-attf-class="text-sm font-medium transition-colors hover:text-gold #{'text-gold' if request.httprequest.path == '/aboutus' else 'text-navy/80'}" t-attf-style="#{'color: #d4a14a; font-weight: 600;' if request.httprequest.path == '/aboutus' else ''}" href="/aboutus">About</a>
<a t-attf-class="text-sm font-medium transition-colors hover:text-gold #{'text-gold' if request.httprequest.path == '/contactus' else 'text-navy/80'}" t-attf-style="#{'color: #d4a14a; font-weight: 600;' if request.httprequest.path == '/contactus' else ''}" href="/contactus">Contact</a>
</nav>
<div class="hidden items-center gap-3 md:flex">
<a href="/rental/request" class="inline-flex items-center justify-center gap-2 whitespace-nowrap font-medium cursor-pointer shadow h-8 rounded-md px-3 text-xs bg-navy text-cream hover:bg-navy/90" style="color: #fcf6e9;">Book a Consultation</a>
</div>
<!-- Mobile Hamburger Button -->
<button class="md:hidden text-navy" aria-label="Toggle menu" id="mobileMenuBtn" style="background: none; border: none; cursor: pointer; padding: 4px;">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M4 5h16"/><path d="M4 12h16"/><path d="M4 19h16"/></svg>
</button>
</div>
<!-- Mobile Drawer Overlay -->
<div id="mobileDrawerOverlay" style="display: none; position: fixed; inset: 0; background: rgba(0,0,0,0.3); z-index: 998;"></div>
<!-- Mobile Drawer Panel -->
<div id="mobileDrawer" style="position: fixed; top: 0; right: 0; height: 100vh; width: min(320px, 90vw); background-color: #fcf6e9; z-index: 999; transform: translateX(100%); visibility: hidden; transition: transform 0.3s ease, visibility 0.3s ease; display: flex; flex-direction: column; box-shadow: -4px 0 24px rgba(11,34,62,0.12);">
<!-- Drawer Header -->
<div style="display: flex; align-items: center; justify-content: space-between; padding: 1.25rem 1.5rem; border-bottom: 1px solid #e0d6c6;">
<a href="/" style="display: inline-flex; align-items: center; gap: 0.75rem; text-decoration: none;">
<img alt="Aakriti Design" src="/theme_aakriti_events/static/src/img/logo-aakriti.ico" style="height: 2.75rem; width: 2.75rem; object-fit: contain;"/>
<span style="display: flex; flex-direction: column; line-height: 1;">
<span style="font-family: 'Playfair Display', Georgia, serif; font-size: 1.1rem; color: #0b223e;">Aakriti Design</span>
<span style="font-size: 0.6rem; text-transform: uppercase; letter-spacing: 0.25em; color: #94a3b8;">Vastu Consultation</span>
</span>
</a>
<button id="mobileDrawerCloseBtn" aria-label="Close menu" style="background: none; border: none; cursor: pointer; color: #0b223e; padding: 4px;">
<svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg>
</button>
</div>
<!-- Drawer Nav Links -->
<nav style="flex: 1; display: flex; flex-direction: column; padding: 2rem 1.5rem; gap: 0;">
<a t-attf-href="/" t-attf-style="display: block; font-family: 'Playfair Display', Georgia, serif; font-size: 1.35rem; padding: 0.9rem 0; color: #{'#d4a14a' if request.httprequest.path == '/' else '#0b223e'}; text-decoration: none; border-bottom: 1px solid #e0d6c6; transition: color 0.2s;" onmouseover="this.style.color='#d4a14a'" onmouseout="this.style.color=this.getAttribute('data-base-color')" data-base-color="#0b223e">Home</a>
<a t-attf-href="/rentals" style="display: block; font-family: 'Playfair Display', Georgia, serif; font-size: 1.35rem; padding: 0.9rem 0; color: #0b223e; text-decoration: none; border-bottom: 1px solid #e0d6c6; transition: color 0.2s;" onmouseover="this.style.color='#d4a14a'" onmouseout="this.style.color='#0b223e'">Services</a>
<a t-attf-href="/aboutus" style="display: block; font-family: 'Playfair Display', Georgia, serif; font-size: 1.35rem; padding: 0.9rem 0; color: #0b223e; text-decoration: none; border-bottom: 1px solid #e0d6c6; transition: color 0.2s;" onmouseover="this.style.color='#d4a14a'" onmouseout="this.style.color='#0b223e'">About</a>
<a t-attf-href="/contactus" style="display: block; font-family: 'Playfair Display', Georgia, serif; font-size: 1.35rem; padding: 0.9rem 0; color: #0b223e; text-decoration: none; transition: color 0.2s;" onmouseover="this.style.color='#d4a14a'" onmouseout="this.style.color='#0b223e'">Contact</a>
</nav>
<!-- Drawer CTA Button -->
<div style="padding: 1.5rem;">
<a href="/rental/request" style="display: block; text-align: center; background-color: #0b223e; color: #fcf6e9; font-size: 0.9rem; font-weight: 500; padding: 0.9rem 1.5rem; border-radius: 0.5rem; text-decoration: none; transition: background-color 0.2s;" onmouseover="this.style.backgroundColor='#1a3a5c'" onmouseout="this.style.backgroundColor='#0b223e'">Book a Consultation</a>
</div>
</div>
<script>
//<![CDATA[
(function() {
var overlay = document.getElementById('mobileDrawerOverlay');
var drawer = document.getElementById('mobileDrawer');
var btn = document.getElementById('mobileMenuBtn');
function openDrawer() {
drawer.style.transform = 'translateX(0)';
drawer.style.visibility = 'visible';
overlay.style.display = 'block';
document.body.style.overflow = 'hidden';
}
function closeDrawer() {
drawer.style.transform = 'translateX(100%)';
drawer.style.visibility = 'hidden';
overlay.style.display = 'none';
document.body.style.overflow = '';
}
if (btn) {
btn.addEventListener('click', function() {
if (window.innerWidth > 767) return;
var isOpen = drawer.style.transform === 'translateX(0px)' || drawer.style.transform === 'translateX(0)';
if (isOpen) { closeDrawer(); } else { openDrawer(); }
});
}
var closeBtn = document.getElementById('mobileDrawerCloseBtn');
if (closeBtn) {
closeBtn.addEventListener('click', function() { closeDrawer(); });
}
if (overlay) {
overlay.addEventListener('click', function() { closeDrawer(); });
}
document.querySelectorAll('#mobileDrawer a').forEach(function(link) {
link.addEventListener('click', function() { closeDrawer(); });
});
window.addEventListener('resize', function() {
if (window.innerWidth > 767) { closeDrawer(); }
});
})();
//]]>
</script>
</header>
</xpath>
<!-- Footer Override -->
<xpath expr="//footer[@id='bottom']" position="attributes">
<attribute name="style" add="background-color: #fcf6e9 !important; border-top: none !important; padding:0 !important;" separator=";"/>
<attribute name="class" add="tailwind-wrapper" separator=" "/>
</xpath>
<!-- Hide Odoo's default copyright area -->
<xpath expr="//div[hasclass('o_footer_copyright')]" position="attributes">
<attribute name="class" add="d-none" separator=" "/>
</xpath>
<!-- Replace main footer div -->
<xpath expr="//div[@id='footer']" position="replace">
<div id="footer">
<footer class="border-t border-border/60 bg-cream tailwind-wrapper" style="background-color: #fcf6e9; border-top: 1px solid #e0d6c6;">
<div class="mx-auto max-w-6xl px-6 py-14">
<div class="grid gap-10 md:grid-cols-4">
<div class="md:col-span-2">
<a class="group inline-flex items-center gap-3 active" href="/">
<img alt="Aakriti Design" class="h-12 w-12 object-contain transition-transform duration-700 group-hover:rotate-6" src="/theme_aakriti_events/static/src/img/logo-aakriti.ico"/>
<span class="flex flex-col leading-none">
<span class="font-serif text-xl text-navy">Aakriti Design</span>
<span class="text-[10px] uppercase tracking-[0.25em] text-muted-foreground">Vastu Consultation</span>
</span>
</a>
<p class="mt-4 max-w-sm text-sm" style="margin-top: 1rem; color: #000000;">Thoughtful Vastu guidance for homes, businesses, and wellness spaces - by Parul.</p>
</div>
<div>
<h2 class="mb-3 text-base font-serif font-bold uppercase tracking-wider" style="color: #0b223e; margin-bottom: 0.75rem; font-family: 'Playfair Display', Georgia, serif;">Explore</h2>
<style> .footer-link:hover { color: #d4a14a !important; } </style>
<ul class="space-y-2 text-sm" style="list-style: none; padding: 0; margin: 0; gap: 0.5rem; display: flex; flex-direction: column; color: #000000;">
<li><a href="/rentals" class="text-black footer-link" style="transition: color 0.2s; text-decoration: none;">Services</a></li>
<li><a href="/aboutus" class="text-black footer-link" style="transition: color 0.2s; text-decoration: none;">About Parul</a></li>
<li><a href="/rental/request" class="text-black footer-link" style="transition: color 0.2s; text-decoration: none;">Book a session</a></li>
<li><a href="/contactus" class="text-black footer-link" style="transition: color 0.2s; text-decoration: none;">Contact</a></li>
</ul>
</div>
<div>
<h2 class="mb-3 text-base font-serif font-bold uppercase tracking-wider" style="color: #0b223e; margin-bottom: 0.75rem; font-family: 'Playfair Display', Georgia, serif;">Connect</h2>
<ul class="space-y-2 text-sm" style="list-style: none; padding: 0; margin: 0; gap: 0.5rem; display: flex; flex-direction: column; color: #000000;">
<li>info@aakritidesign.com</li>
<li>By appointment</li>
</ul>
</div>
</div>
<div class="mt-12" style="margin-top: 3rem; height: 1.5px; border: none; background: linear-gradient(to right, transparent, #d4a14a, transparent);"></div>
<p class="mt-6 text-center text-xs" style="margin-top: 1.5rem; color: #000000;">@ 2026 Aakriti Design. Vastu guidance is advisory in nature.</p>
</div>
</footer>
</div>
</xpath>
</template>
<!-- Inherit and Override About Us page -->
<template id="theme_aakriti_events_aboutus" inherit_id="website.aboutus" active="True">
<xpath expr="//div[@id='wrap']" position="replace">
<div id="wrap" class="oe_structure oe_empty tailwind-wrapper bg-cream" style="background-color: #fcf6e9;">
<main class="flex-1">
<section class="mx-auto grid max-w-6xl gap-12 px-6 py-24 md:grid-cols-[1fr_0.85fr] md:items-start md:gap-16">
<div>
<p class="mb-4 text-xs uppercase tracking-[0.4em] text-gold">About</p>
<h1 class="font-serif text-5xl text-navy md:text-6xl">About Parul - Vastu Consultant</h1>
<div class="my-10 w-full max-w-2xl" style="height: 1px; background: linear-gradient(to right, transparent, rgba(212, 161, 74, 0.4), transparent);"></div>
<div class="space-y-6 text-lg leading-relaxed text-muted-foreground">
<p>Aakriti Design was founded on a simple belief - that the spaces we inhabit shape how we feel, work, rest, and grow.</p>
<p>I combine traditional Vastu principles with a modern, design-led sensibility. My consultations are warm, practical, and never prescriptive - guidance you can actually live with.</p>
<p>Whether you're settling into a new home, opening a wellness studio, or wanting to gently reset the energy of a space you've known for years, I'd be honoured to help.</p>
</div>
<div class="mt-12">
<a href="/rental/request" class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium cursor-pointer transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 disabled:cursor-not-allowed [&amp;_svg]:pointer-events-none [&amp;_svg]:size-4 [&amp;_svg]:shrink-0 shadow h-9 px-4 py-2 bg-navy text-cream hover:bg-navy/90">Book a consultation</a>
</div>
</div>
<div class="relative md:sticky md:top-24" id="__FPSC_ID_2_1781584228681" style="">
<div class="absolute -inset-4 -z-10 rounded-3xl bg-gradient-to-br from-gold-soft/40 to-sage/15 blur-2xl"></div>
<img alt="Aakriti Design - Create a space that supports your life." class="w-full rounded-2xl shadow-2xl ring-1 ring-navy/10" loading="lazy" src="/theme_aakriti_events/static/src/img/vastu-poster.png"/>
</div>
</section>
</main>
</div>
</xpath>
</template>
<!-- Inherit and Override Contact Us page -->
<template id="theme_aakriti_events_contactus" inherit_id="website.contactus" active="True">
<xpath expr="//div[@id='wrap']" position="replace">
<div id="wrap" class="oe_structure oe_empty tailwind-wrapper bg-cream" style="background-color: #fcf6e9; min-height: 80vh; display: flex; align-items: center; justify-content: center;">
<main class="flex-1 flex flex-col items-center justify-center py-24 px-6 text-center w-full">
<p class="mb-4 text-xs uppercase tracking-[0.4em] text-gold w-full" style="color: #d4a14a; letter-spacing: 0.4em; text-transform: uppercase; font-size: 0.75rem;">Contact</p>
<h1 class="font-serif text-5xl text-navy md:text-6xl w-full mt-2 mb-10" style="color: #0b223e;">Let's connect</h1>
<div class="my-10 w-full max-w-2xl mx-auto" style="height: 1px; background: linear-gradient(to right, transparent, rgba(212, 161, 74, 0.4), transparent);"></div>
<p class="max-w-xl mx-auto text-muted-foreground leading-relaxed mt-10" style="color: #64748b;">
For enquiries, collaborations, or general questions, send a note. I respond personally within two business days.
</p>
<div class="mt-12 flex items-center justify-center gap-3 text-lg font-serif text-navy" style="color: #0b223e; margin-top: 3rem;">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="h-6 w-6"><rect width="20" height="16" x="2" y="4" rx="2"></rect><path d="m22 7-8.97 5.7a1.94 1.94 0 0 1-2.06 0L2 7"></path></svg>
<style> .contact-email:hover { color: #d4a14a !important; } </style><a href="mailto:info@aakritidesign.com" class="contact-email transition-colors text-xl" style="color: #0b223e; text-decoration: none;">info@aakritidesign.com</a>
</div>
</main>
</div>
</xpath>
</template>
</odoo>