Add homepage template with custom styles and content for Aakriti Design events

This commit is contained in:
Alaguraj0361 2026-06-12 15:31:34 +05:30
parent db4f4f7ef1
commit c60f36f7c1

View File

@ -688,4 +688,624 @@
</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">
<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');
.aakriti-home-wrap {
background-color: #FAF8F5 !important;
font-family: 'Inter', sans-serif !important;
color: #1A1519;
}
.aakriti-cursive {
font-family: 'Playball', cursive !important;
color: #C5A880 !important;
font-size: 2.2rem;
}
h1, h2, h3, h4, h5, h6 {
font-family: 'Outfit', sans-serif !important;
color: #1A1519;
}
.text-brand-plum { color: #714B67 !important; }
.text-brand-gold { color: #C5A880 !important; }
.bg-brand-plum { background-color: #714B67 !important; color: white !important; }
.bg-brand-gold { background-color: #C5A880 !important; color: white !important; }
/* Hero Carousel Styles */
.carousel-item {
height: 90vh;
min-height: 550px;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
}
.carousel-overlay {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: linear-gradient(rgba(113, 75, 103, 0.4), rgba(26, 21, 25, 0.85));
}
.carousel-caption-custom {
position: absolute;
top: 55%;
transform: translateY(-50%);
left: 8%;
right: 8%;
text-align: left;
color: white;
max-width: 800px;
z-index: 10;
}
.carousel-pretitle {
font-size: 0.95rem;
letter-spacing: 4px;
font-weight: 700;
color: #C5A880;
margin-bottom: 15px;
display: block;
text-transform: uppercase;
}
.carousel-title {
font-size: 3.5rem;
font-weight: 800;
color: white !important;
line-height: 1.15;
margin-bottom: 20px;
}
.carousel-text {
font-size: 1.15rem;
font-weight: 300;
line-height: 1.6;
color: #F3EFF2;
margin-bottom: 35px;
}
/* Buttons */
.btn-premium-primary {
background-color: #714B67 !important;
border: 1px solid #714B67 !important;
color: white !important;
font-weight: 700;
letter-spacing: 1px;
padding: 14px 28px;
border-radius: 30px;
transition: all 0.3s ease;
text-transform: uppercase;
font-size: 0.85rem;
display: inline-block;
text-decoration: none;
}
.btn-premium-primary:hover {
background-color: #59294C !important;
transform: translateY(-2px);
box-shadow: 0 5px 15px rgba(113, 75, 103, 0.4);
}
.btn-premium-secondary {
background-color: transparent !important;
border: 2px solid white !important;
color: white !important;
font-weight: 700;
letter-spacing: 1px;
padding: 12px 28px;
border-radius: 30px;
transition: all 0.3s ease;
text-transform: uppercase;
font-size: 0.85rem;
margin-left: 15px;
display: inline-block;
text-decoration: none;
}
.btn-premium-secondary:hover {
background-color: white !important;
color: #1A1519 !important;
transform: translateY(-2px);
text-decoration: none;
}
/* Section Styles */
.section-padding {
padding: 90px 0;
}
.section-subtitle {
font-size: 0.9rem;
text-transform: uppercase;
letter-spacing: 3px;
font-weight: 700;
color: #C5A880;
margin-bottom: 10px;
display: block;
}
.section-title {
font-size: 2.5rem;
font-weight: 700;
margin-bottom: 25px;
color: #714B67;
}
/* About Collage Grid */
.about-collage {
position: relative;
height: 520px;
}
.collage-img {
position: absolute;
border-radius: 12px;
box-shadow: 0 10px 30px rgba(113, 75, 103, 0.08);
object-fit: cover;
border: 4px solid white;
}
.collage-img-1 {
width: 60%;
height: 75%;
top: 0;
left: 0;
z-index: 3;
}
.collage-img-2 {
width: 50%;
height: 50%;
top: 10%;
right: 0;
z-index: 2;
}
.collage-img-3 {
width: 45%;
height: 45%;
bottom: 0;
right: 8%;
z-index: 4;
}
/* Strength Cards */
.strength-card {
background: white;
border: 1px solid #EAE5E8;
border-radius: 16px;
transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
overflow: hidden;
box-shadow: 0 4px 20px rgba(113, 75, 103, 0.02);
}
.strength-card:hover {
transform: translateY(-8px);
box-shadow: 0 12px 30px rgba(113, 75, 103, 0.08);
border-color: #C5A880;
}
/* Choose Us layout */
.choose-us-icon-box {
background: #FAF4F8;
width: 60px;
height: 60px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 20px;
border: 2px solid #C5A880;
}
.choose-us-icon-box img {
width: 32px;
height: 32px;
}
.choose-us-center-img-wrap {
position: relative;
text-align: center;
}
.choose-us-center-img-wrap img {
width: 290px;
height: 290px;
border-radius: 50%;
object-fit: cover;
border: 6px solid #C5A880;
box-shadow: 0 10px 30px rgba(113, 75, 103, 0.1);
}
/* Service Cards */
.service-card {
background: white;
border: 1px solid #EAE5E8;
border-radius: 16px;
overflow: hidden;
transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
box-shadow: 0 4px 20px rgba(113, 75, 103, 0.02);
}
.service-card:hover {
transform: translateY(-8px);
box-shadow: 0 12px 30px rgba(113, 75, 103, 0.08);
border-color: #714B67;
}
.service-img-container {
height: 240px;
overflow: hidden;
position: relative;
background-color: #F8F5F7;
}
.service-img-container img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.5s ease;
}
.service-card:hover .service-img-container img {
transform: scale(1.08);
}
.service-icon-badge {
position: absolute;
bottom: -20px;
right: 20px;
width: 50px;
height: 50px;
background: white;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
box-shadow: 0 4px 10px rgba(0,0,0,0.06);
border: 2px solid #C5A880;
}
.service-icon-badge img {
width: 24px;
height: 24px;
}
/* Glassmorphism Inquiry Form */
.inquiry-card {
background: #ffffff;
border: 1px solid #EAE5E8;
box-shadow: 0 10px 40px rgba(113, 75, 103, 0.04);
border-radius: 20px;
}
/* FAQ Accordion */
.faq-accordion .accordion-item {
border: 1px solid #EAE5E8;
border-radius: 12px !important;
margin-bottom: 15px;
overflow: hidden;
box-shadow: 0 2px 10px rgba(0,0,0,0.01);
}
.faq-accordion .accordion-button {
font-family: 'Outfit', sans-serif;
font-weight: 600;
color: #714B67;
padding: 18px 20px;
}
.faq-accordion .accordion-button:not(.collapsed) {
background-color: #FAF4F8;
color: #714B67;
box-shadow: none;
}
.faq-accordion .accordion-body {
padding: 20px;
line-height: 1.6;
color: #5C555B;
}
/* Testimonial slider */
.testimonial-card {
background: white;
border: 1px solid #EAE5E8;
border-radius: 16px;
padding: 30px;
box-shadow: 0 4px 20px rgba(113, 75, 103, 0.02);
}
.quote-icon {
color: #C5A880;
font-size: 3rem;
line-height: 1;
}
</style>
<div id="wrap" class="aakriti-home-wrap oe_structure oe_empty">
<!-- Bootstrap Carousel Hero Section -->
<div id="aakritiHeroCarousel" class="carousel slide carousel-fade" data-bs-ride="carousel" data-bs-interval="6000">
<div class="carousel-indicators">
<button type="button" data-bs-target="#aakritiHeroCarousel" data-bs-slide-to="0" class="active" aria-current="true" aria-label="Slide 1"></button>
<button type="button" data-bs-target="#aakritiHeroCarousel" data-bs-slide-to="1" aria-label="Slide 2"></button>
<button type="button" data-bs-target="#aakritiHeroCarousel" data-bs-slide-to="2" aria-label="Slide 3"></button>
</div>
<div class="carousel-inner">
<!-- Slide 1 -->
<div class="carousel-item active" style="background-image: url('https://events.aakritidesign.com/assets/img/home/banner/home-banner-1.webp');">
<div class="carousel-overlay"></div>
<div class="carousel-caption-custom">
<span class="carousel-pretitle">Aakriti Design | Events</span>
<h1 class="carousel-title">Live Life Through<br/>Design and Purpose</h1>
<p class="carousel-text">Custom event decor and wedding design created with meaning, intention, and cultural understanding. Aakriti Design specializes in fusion and multicultural events, bringing thoughtful design that reflects both tradition and emotion.</p>
<div class="carousel-cta">
<a href="/rentals" class="btn btn-premium-primary">Explore Design</a>
<a href="/rental/request" class="btn btn-premium-secondary">Book Consultation</a>
</div>
</div>
</div>
<!-- Slide 2 -->
<div class="carousel-item" style="background-image: url('https://events.aakritidesign.com/assets/img/home/banner/home-banner-2.webp');">
<div class="carousel-overlay"></div>
<div class="carousel-caption-custom">
<span class="carousel-pretitle">Aakriti Design | Events</span>
<h1 class="carousel-title">Designing Experiences<br/>Beyond Aesthetics</h1>
<p class="carousel-text">We design and manage events with insight, not just aesthetics. With a deep understanding of how traditions, families, logistics, and emotions intersect, every celebration is planned with care and clarity.</p>
<div class="carousel-cta">
<a href="/rentals" class="btn btn-premium-primary">Explore Design</a>
<a href="/rental/request" class="btn btn-premium-secondary">Book Consultation</a>
</div>
</div>
</div>
<!-- Slide 3 -->
<div class="carousel-item" style="background-image: url('https://events.aakritidesign.com/assets/img/home/banner/home-banner-3.webp');">
<div class="carousel-overlay"></div>
<div class="carousel-caption-custom">
<span class="carousel-pretitle">Aakriti Design | Events</span>
<h1 class="carousel-title">Confidence Built<br/>Through Experience</h1>
<p class="carousel-text">There is an unspoken confidence that comes from years of hands-on experience, problem solving, and real-world execution — and that strength shows through every detail we deliver.</p>
<div class="carousel-cta">
<a href="/rentals" class="btn btn-premium-primary">Explore Design</a>
<a href="/rental/request" class="btn btn-premium-secondary">Book Consultation</a>
</div>
</div>
</div>
</div>
</div>
<!-- About Us Section -->
<section class="section-padding">
<div class="container">
<div class="row align-items-center">
<div class="col-lg-6 mb-5 mb-lg-0">
<div class="about-collage">
<img src="https://events.aakritidesign.com/assets/img/home/banner/about/about-us-left.webp" class="collage-img collage-img-1" alt="About Left"/>
<img src="https://events.aakritidesign.com/assets/img/home/banner/about/about-us-top.webp" class="collage-img collage-img-2" alt="About Top"/>
<img src="https://events.aakritidesign.com/assets/img/home/banner/about/about-us-bottom.webp" class="collage-img collage-img-3" alt="About Bottom"/>
</div>
</div>
<div class="col-lg-6 ps-lg-5">
<span class="section-subtitle">About Us</span>
<h2 class="section-title">We Are Aakrithi</h2>
<p class="lead font-weight-semibold text-brand-plum mb-4" style="font-size: 1.15rem; line-height: 1.6;">
Aakriti Design specializes in event decor and wedding design that goes beyond surface level styling. We design environments that reflect your story, your culture, and the experience you want your guests to remember.
</p>
<p class="text-muted mb-4" style="line-height: 1.7;">
Every celebration carries emotion, movement, and energy. Our approach to event design begins with understanding how people gather, how a space flows, and how each element supports the overall experience. From weddings and fusion celebrations to private and corporate events, design is considered in relation to the space, the guests, and the moment being celebrated.
</p>
<a href="/rentals" class="btn btn-premium-primary px-4 mt-2">Browse Collections</a>
</div>
</div>
</div>
</section>
<!-- Featured Strengths Section -->
<section class="section-padding bg-white border-top border-bottom">
<div class="container">
<div class="text-center mb-5">
<span class="section-subtitle">Our Strengths</span>
<h2 class="section-title">Core Strengths to Highlight</h2>
</div>
<div class="row">
<div class="col-md-4 mb-4">
<div class="strength-card h-100 p-4">
<img src="https://events.aakritidesign.com/assets/img/home/banner/strength/our-strengths-custom.webp" class="img-fluid rounded mb-3" style="height: 180px; width: 100%; object-fit: cover;" alt="Custom Event Design"/>
<h4 class="h5 font-weight-bold text-brand-plum mb-2">Custom Event Design</h4>
<p class="text-muted mb-0" style="font-size: 0.9rem;">Bespoke visual elements and creative designs built specifically to reflect your story and aesthetic vision.</p>
</div>
</div>
<div class="col-md-4 mb-4">
<div class="strength-card h-100 p-4">
<img src="https://events.aakritidesign.com/assets/img/home/banner/strength/our-strengths-fusion.webp" class="img-fluid rounded mb-3" style="height: 180px; width: 100%; object-fit: cover;" alt="Multicultural Fusion"/>
<h4 class="h5 font-weight-bold text-brand-plum mb-2">Multicultural Fusion</h4>
<p class="text-muted mb-0" style="font-size: 0.9rem;">Expert blending of varied cultural rituals and design aesthetics for respectful and unique celebrations.</p>
</div>
</div>
<div class="col-md-4 mb-4">
<div class="strength-card h-100 p-4">
<img src="https://events.aakritidesign.com/assets/img/home/banner/strength/our-strengths-space.webp" class="img-fluid rounded mb-3" style="height: 180px; width: 100%; object-fit: cover;" alt="Space &amp; Flow Planning"/>
<h4 class="h5 font-weight-bold text-brand-plum mb-2">Space &amp; Flow Planning</h4>
<p class="text-muted mb-0" style="font-size: 0.9rem;">Detailed layout architecture that guides guest movement and coordinates setup logistics smoothly.</p>
</div>
</div>
</div>
</div>
</section>
<!-- Why Choose Us / The Aakriti Difference -->
<section class="section-padding">
<div class="container">
<div class="text-center mb-5 pb-3">
<span class="section-subtitle">The Aakriti Difference</span>
<h2 class="section-title">Why Choose Us?</h2>
</div>
<div class="row align-items-center">
<!-- Left column -->
<div class="col-lg-4">
<div class="d-flex mb-5">
<div class="me-3">
<div class="choose-us-icon-box">
<img src="https://events.aakritidesign.com/assets/why-choose-us/icon/fusion.webp" alt="Fusion"/>
</div>
</div>
<div>
<h4 class="h5 font-weight-bold mb-2">Fusion Wedding Experts</h4>
<p class="text-muted" style="font-size: 0.9rem;">Specializing in multicultural celebrations, we thoughtfully blend traditions with modern design for a respectful experience.</p>
</div>
</div>
<div class="d-flex mb-5 mb-lg-0">
<div class="me-3">
<div class="choose-us-icon-box">
<img src="https://events.aakritidesign.com/assets/why-choose-us/icon/intentional.webp" alt="Space"/>
</div>
</div>
<div>
<h4 class="h5 font-weight-bold mb-2">Intentional Space Design</h4>
<p class="text-muted" style="font-size: 0.9rem;">We design environments in relation to the space and guest flow, ensuring every element supports the energy of the gathering.</p>
</div>
</div>
</div>
<!-- Center Image -->
<div class="col-lg-4 my-4 my-lg-0 text-center">
<div class="choose-us-center-img-wrap">
<img src="https://events.aakritidesign.com/assets/why-choose-us/centre-img.webp" alt="Aakriti Design center circle decoration"/>
</div>
</div>
<!-- Right column -->
<div class="col-lg-4">
<div class="d-flex mb-5">
<div class="me-3">
<div class="choose-us-icon-box">
<img src="https://events.aakritidesign.com/assets/why-choose-us/icon/expert.webp" alt="Expert"/>
</div>
</div>
<div>
<h4 class="h5 font-weight-bold mb-2">Expert Execution Insight</h4>
<p class="text-muted" style="font-size: 0.9rem;">With over 10 years of experience, we understand not only how events should look, but how they function in real time for a stress-free day.</p>
</div>
</div>
<div class="d-flex">
<div class="me-3">
<div class="choose-us-icon-box">
<img src="https://events.aakritidesign.com/assets/why-choose-us/icon/bespoke.webp" alt="Bespoke"/>
</div>
</div>
<div>
<h4 class="h5 font-weight-bold mb-2">Bespoke Creative Styling</h4>
<p class="text-muted" style="font-size: 0.9rem;">Your story is never a template. We design from the ground up, creating environments that reflect your unique culture and vision.</p>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Services Grid Section -->
<section class="section-padding bg-white border-top">
<div class="container">
<div class="text-center mb-5">
<span class="section-subtitle">Our Services</span>
<h2 class="section-title">Service Based Excellence</h2>
</div>
<div class="row">
<t t-set="services_list" t-value="[
('Wedding Decor &amp; Styling', 'https://events.aakritidesign.com/assets/img/home/banner/services/our-services-img-wedding-decor.webp', 'https://events.aakritidesign.com/assets/img/home/banner/services/icon/our-services-wedding-decor.webp'),
('Multicultural Fusion Weddings', 'https://events.aakritidesign.com/assets/img/home/banner/services/our-services-img-fusion-wedding.webp', 'https://events.aakritidesign.com/assets/img/home/banner/services/icon/our-services-fusion.webp'),
('Ceremony &amp; Reception Design', 'https://events.aakritidesign.com/assets/img/home/banner/services/our-services-img-reception.webp', 'https://events.aakritidesign.com/assets/img/home/banner/services/icon/our-services-reception.webp'),
('Stage &amp; Mandap Design', 'https://events.aakritidesign.com/assets/img/home/banner/services/our-services-img-stage.webp', 'https://events.aakritidesign.com/assets/img/home/banner/services/icon/our-services-stage.webp'),
('Table &amp; Floral Styling', 'https://events.aakritidesign.com/assets/img/home/banner/services/our-services-img-table.webp', 'https://events.aakritidesign.com/assets/img/home/banner/services/icon/our-services-table.webp'),
('Event Rentals &amp; Custom Builds', 'https://events.aakritidesign.com/assets/img/home/banner/services/our-services-img-event-rentals.webp', 'https://events.aakritidesign.com/assets/img/home/banner/services/icon/our-services-event-rental.webp')
]"/>
<t t-foreach="services_list" t-as="srv">
<div class="col-lg-4 col-md-6 mb-4">
<div class="service-card h-100">
<div class="service-img-container">
<img t-att-src="srv[1]" alt="Service Image"/>
<div class="service-icon-badge">
<img t-att-src="srv[2]" alt="Icon"/>
</div>
</div>
<div class="p-4 pt-5">
<h4 class="h5 font-weight-bold text-brand-plum mb-3" t-out="srv[0]"/>
<p class="text-muted mb-0" style="font-size: 0.9rem; line-height: 1.6;">Luxury, experience-driven design and logistics coordination matching your exact theme.</p>
</div>
</div>
</div>
</t>
</div>
<div class="text-center mt-4">
<a href="/rentals" class="btn btn-premium-primary px-5">Inquire and Rent Now</a>
</div>
</div>
</section>
<!-- FAQ & Common Questions Section -->
<section class="section-padding">
<div class="container">
<div class="row align-items-center">
<!-- Image panel -->
<div class="col-lg-5 mb-5 mb-lg-0">
<div class="pe-lg-4">
<img src="https://events.aakritidesign.com/assets/img/home/banner/why-choose-us.webp" class="img-fluid rounded shadow" style="border-radius: 16px !important;" alt="FAQ panel"/>
</div>
</div>
<!-- Accordion panel -->
<div class="col-lg-7">
<span class="section-subtitle">FAQ's</span>
<h2 class="section-title">Common Questions &amp; Insights</h2>
<p class="text-muted mb-4">We believe in transparency and clarity. Here are some of the most common questions our clients ask about our bespoke event design process.</p>
<div class="accordion faq-accordion" id="aakritiFAQAccordion">
<div class="accordion-item">
<h2 class="accordion-header" id="faqHeading1">
<button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#faqCollapse1" aria-expanded="true" aria-controls="faqCollapse1">
Can you design a fusion wedding that includes multiple cultures or religious ceremonies?
</button>
</h2>
<div id="faqCollapse1" class="accordion-collapse collapse show" aria-labelledby="faqHeading1" data-bs-parent="#aakritiFAQAccordion">
<div class="accordion-body">
Yes. Aakriti Design specializes in fusion and multicultural weddings, thoughtfully blending traditions with modern design in a seamless and respectful way.
</div>
</div>
</div>
<div class="accordion-item">
<h2 class="accordion-header" id="faqHeading2">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#faqCollapse2" aria-expanded="false" aria-controls="faqCollapse2">
Do you work with different budgets?
</button>
</h2>
<div id="faqCollapse2" class="accordion-collapse collapse" aria-labelledby="faqHeading2" data-bs-parent="#aakritiFAQAccordion">
<div class="accordion-body">
Yes. We work across a range of budgets and focus on creating custom solutions that feel intentional, well executed, and aligned with the scale of each celebration.
</div>
</div>
</div>
<div class="accordion-item">
<h2 class="accordion-header" id="faqHeading3">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#faqCollapse3" aria-expanded="false" aria-controls="faqCollapse3">
Do you offer full-service event decor or rentals only?
</button>
</h2>
<div id="faqCollapse3" class="accordion-collapse collapse" aria-labelledby="faqHeading3" data-bs-parent="#aakritiFAQAccordion">
<div class="accordion-body">
We offer both. Our services include custom decor design, styling, rentals, and on-site execution support, depending on the needs of the event.
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Meet the Founder Spotlight -->
<section class="section-padding bg-white border-top border-bottom">
<div class="container">
<div class="row align-items-center">
<div class="col-lg-6 ps-lg-5 order-lg-2 mb-5 mb-lg-0 text-center">
<img src="https://events.aakritidesign.com/assets/img/home/banner/founder-bio.webp" class="img-fluid rounded-circle shadow" style="width: 320px; height: 320px; object-fit: cover; border: 6px solid #C5A880;" alt="Paarul Ladd"/>
</div>
<div class="col-lg-6 order-lg-1">
<span class="section-subtitle">Bio</span>
<h2 class="section-title">Meet the Creative Behind the Work</h2>
<h4 class="h5 text-brand-plum font-weight-bold mb-1">Paarul Ladd</h4>
<span class="text-muted d-block mb-4" style="font-size: 0.9rem; font-style: italic;">Founder &amp; Creative Director</span>
<p class="text-muted mb-3" style="line-height: 1.7;">
Paarul Ladd is the creative force behind Aakriti Design Events, bringing over 10 years of experience in event design, logistics, and space management. Her work is informed by a deep understanding of how celebrations unfold, how families interact, and how environments shape experience.
</p>
<p class="text-muted mb-3" style="line-height: 1.7;">
Paarul is known for her ability to blend cultures seamlessly, creating events that feel personal, thoughtful, and beautifully balanced. Her background spans large scale events, intimate weddings, and complex fusion celebrations, giving her a grounded perspective that goes far beyond aesthetics.
</p>
<p class="text-muted mb-0" style="line-height: 1.7;">
Clients trust Paarul not only for her creative eye, but for her calm presence, practical insight, and ability to guide them through the process with clarity and confidence.
</p>
</div>
</div>
</div>
</section>
</div>
</xpath>
</template>
</odoo>