diff --git a/addons/tncsc_deployment/__manifest__.py b/addons/tncsc_deployment/__manifest__.py
index caa6115..d8536a1 100644
--- a/addons/tncsc_deployment/__manifest__.py
+++ b/addons/tncsc_deployment/__manifest__.py
@@ -1,6 +1,6 @@
 {
     'name': 'TNCSC Deployment',
-    'version': '19.0.1.3.0',
+    'version': '19.0.1.3.3',
     'category': 'Hidden',
     'summary': 'Tamil Nadu Cultural Society of Canada - client configuration for the Community OS suite',
     'description': """
diff --git a/addons/tncsc_deployment/data/events_data.xml b/addons/tncsc_deployment/data/events_data.xml
index 3603821..75def28 100644
--- a/addons/tncsc_deployment/data/events_data.xml
+++ b/addons/tncsc_deployment/data/events_data.xml
@@ -37,10 +37,36 @@
     <record id="event_summer_picnic_2026" model="event.event">
         <field name="name">TNCSC's Summer Picnic 2026</field>
         <field name="stage_id" ref="event.event_stage_new"/>
+        <field name="subtitle">Community  |  Games  |  Family Fun</field>
         <field name="date_begin" eval="'2026-10-11 14:00:00'"/>
         <field name="date_end" eval="'2026-10-12 14:00:00'"/>
         <field name="address_id" ref="partner_summer_picnic_venue"/>
         <field name="website_published">True</field>
+        <field name="description" type="html">
+            <div class="event-story">
+                <h4 class="fw-bold mb-3" style="color: #120735;">Annual Community Summer Picnic</h4>
+                <p class="lead" style="color: #475569; font-size: 1.1rem; line-height: 1.75;">
+                    Join Tamil families and friends from across Ontario for a sun-filled day of sports, outdoor games, delicious food, and community bonding.
+                </p>
+                <p style="color: #475569; font-size: 1.02rem; line-height: 1.8;">
+                    Our annual Summer Picnic is one of TNCSC's most popular gatherings. Enjoy cricket and volleyball tournaments, children's games, potluck-style South Indian delicacies, and an opportunity to meet and connect with community members old and new.
+                </p>
+                <div class="row g-3 my-3">
+                    <div class="col-md-6">
+                        <div class="p-3 rounded-3" style="background-color: #f8fafc; border-left: 4px solid #e5a93c;">
+                            <h6 class="fw-bold mb-1" style="color: #120735;"><i class="fa fa-futbol-o me-2" style="color: #e5a93c;"/>Sports &amp; Fun Games</h6>
+                            <small class="text-muted">Cricket, volleyball, tug-of-war, and fun family activities for all ages.</small>
+                        </div>
+                    </div>
+                    <div class="col-md-6">
+                        <div class="p-3 rounded-3" style="background-color: #f8fafc; border-left: 4px solid #120735;">
+                            <h6 class="fw-bold mb-1" style="color: #120735;"><i class="fa fa-cutlery me-2" style="color: #120735;"/>Picnic Lunch &amp; BBQ</h6>
+                            <small class="text-muted">Authentic homemade South Indian treats, refreshing drinks, and BBQ.</small>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </field>
     </record>
 
     <!-- 2. Diwali Celebration (Booked) -->
@@ -52,6 +78,31 @@
         <field name="date_end" eval="'2026-11-05 16:30:00'"/>
         <field name="address_id" ref="partner_diwali_venue"/>
         <field name="website_published">True</field>
+        <field name="description" type="html">
+            <div class="event-story">
+                <h4 class="fw-bold mb-3" style="color: #120735;">Grand Diwali Celebration 2026</h4>
+                <p class="lead" style="color: #475569; font-size: 1.1rem; line-height: 1.75;">
+                    Celebrate the Festival of Lights with TNCSC — a joyous evening celebrating the triumph of light over darkness and good over evil.
+                </p>
+                <p style="color: #475569; font-size: 1.02rem; line-height: 1.8;">
+                    Featuring vibrant dance performances by local talents, melodious musical presentations, distribution of traditional Diwali sweets (Mithai), sparklers for children, and an exquisite festive banquet.
+                </p>
+                <div class="row g-3 my-3">
+                    <div class="col-md-6">
+                        <div class="p-3 rounded-3" style="background-color: #f8fafc; border-left: 4px solid #e5a93c;">
+                            <h6 class="fw-bold mb-1" style="color: #120735;"><i class="fa fa-star me-2" style="color: #e5a93c;"/>Musical &amp; Dance Night</h6>
+                            <small class="text-muted">Live orchestral music, classical and cinematic fusion dance by youth.</small>
+                        </div>
+                    </div>
+                    <div class="col-md-6">
+                        <div class="p-3 rounded-3" style="background-color: #f8fafc; border-left: 4px solid #120735;">
+                            <h6 class="fw-bold mb-1" style="color: #120735;"><i class="fa fa-gift me-2" style="color: #120735;"/>Festive Dinner &amp; Sweets</h6>
+                            <small class="text-muted">Traditional Diwali sweets, savory snacks, and festive multi-course dinner.</small>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </field>
     </record>
 
     <!-- 3. Tamil New Year Festival (Announced) -->
@@ -63,6 +114,31 @@
         <field name="date_end" eval="'2026-04-14 15:30:00'"/>
         <field name="address_id" ref="partner_tamil_new_year_venue"/>
         <field name="website_published">True</field>
+        <field name="description" type="html">
+            <div class="event-story">
+                <h4 class="fw-bold mb-3" style="color: #120735;">Tamil New Year (Chithirai Thirunaal) 2026</h4>
+                <p class="lead" style="color: #475569; font-size: 1.1rem; line-height: 1.75;">
+                    Ring in the Tamil New Year (Puthandu) with joy, cultural pride, and festive community celebrations.
+                </p>
+                <p style="color: #475569; font-size: 1.02rem; line-height: 1.8;">
+                    A landmark celebration featuring traditional Tamil greetings, Pattimandram (debate show), literary talks, youth talent shows, and a traditional festive lunch celebrating the spirit of renewal and unity.
+                </p>
+                <div class="row g-3 my-3">
+                    <div class="col-md-6">
+                        <div class="p-3 rounded-3" style="background-color: #f8fafc; border-left: 4px solid #e5a93c;">
+                            <h6 class="fw-bold mb-1" style="color: #120735;"><i class="fa fa-microphone me-2" style="color: #e5a93c;"/>Pattimandram &amp; Literary Show</h6>
+                            <small class="text-muted">Thought-provoking debate and speech showcases honoring Tamil literature.</small>
+                        </div>
+                    </div>
+                    <div class="col-md-6">
+                        <div class="p-3 rounded-3" style="background-color: #f8fafc; border-left: 4px solid #120735;">
+                            <h6 class="fw-bold mb-1" style="color: #120735;"><i class="fa fa-leaf me-2" style="color: #120735;"/>New Year Feast</h6>
+                            <small class="text-muted">Manga Pachadi, Payasam, and traditional New Year festive delicacies.</small>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </field>
     </record>
 
     <!-- 4. Pongal Celebration (Ended) -->
@@ -74,5 +150,30 @@
         <field name="date_end" eval="'2026-01-18 09:30:00'"/>
         <field name="address_id" ref="partner_pongal_venue"/>
         <field name="website_published">True</field>
+        <field name="description" type="html">
+            <div class="event-story">
+                <h4 class="fw-bold mb-3" style="color: #120735;">Celebrating Heritage, Harvest &amp; Community</h4>
+                <p class="lead" style="color: #475569; font-size: 1.1rem; line-height: 1.75;">
+                    Pongal is the signature harvest festival of the Tamil people, expressing gratitude to the Sun God, nature, and the farm cattle for a bountiful year.
+                </p>
+                <p style="color: #475569; font-size: 1.02rem; line-height: 1.8;">
+                    The Tamil Nadu Cultural Society of Canada invites all Tamil families and friends across the Greater Toronto Area to celebrate our rich traditions together. Experience the joy of traditional sweet Pongal cooking, soulful folk music (Nadaswaram &amp; Thavil), vibrant Bharatanatyam dance performances, traditional village games, and a grand festive feast (Vazhaillai Sappadu).
+                </p>
+                <div class="row g-3 my-3">
+                    <div class="col-md-6">
+                        <div class="p-3 rounded-3" style="background-color: #f8fafc; border-left: 4px solid #e5a93c;">
+                            <h6 class="fw-bold mb-1" style="color: #120735;"><i class="fa fa-music me-2" style="color: #e5a93c;"/>Cultural Performances</h6>
+                            <small class="text-muted">Classical Bharatanatyam, Tamil folk dance, and music recitals by community youth.</small>
+                        </div>
+                    </div>
+                    <div class="col-md-6">
+                        <div class="p-3 rounded-3" style="background-color: #f8fafc; border-left: 4px solid #120735;">
+                            <h6 class="fw-bold mb-1" style="color: #120735;"><i class="fa fa-cutlery me-2" style="color: #120735;"/>Authentic Feast</h6>
+                            <small class="text-muted">Freshly prepared Sakkarai Pongal, Ven Pongal, and traditional festive meal.</small>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </field>
     </record>
 </odoo>
diff --git a/addons/tncsc_deployment/migrations/19.0.1.3.3/pre-migrate.py b/addons/tncsc_deployment/migrations/19.0.1.3.3/pre-migrate.py
new file mode 100644
index 0000000..d88e381
--- /dev/null
+++ b/addons/tncsc_deployment/migrations/19.0.1.3.3/pre-migrate.py
@@ -0,0 +1,15 @@
+"""Reload the seeded website pages from views/website_pages.xml.
+
+That file is noupdate="1" so edits made in the website editor survive
+upgrades, but it also means upgrades never deliver template fixes.
+Loading it once in 'init' mode rewrites the existing page views.
+
+Runs before the module's data is loaded.
+"""
+from odoo import SUPERUSER_ID, api
+from odoo.tools import convert_file
+
+
+def migrate(cr, version):
+    env = api.Environment(cr, SUPERUSER_ID, {})
+    convert_file(env, 'tncsc_deployment', 'views/website_pages.xml', {}, mode='init', noupdate=True)
diff --git a/addons/tncsc_deployment/views/website_header_overrides.xml b/addons/tncsc_deployment/views/website_header_overrides.xml
index cd04956..2dd980f 100644
--- a/addons/tncsc_deployment/views/website_header_overrides.xml
+++ b/addons/tncsc_deployment/views/website_header_overrides.xml
@@ -103,6 +103,9 @@
         <xpath expr="//t[@t-call='website.layout']" position="inside">
             <t t-set="no_header" t-value="True"/>
         </xpath>
+        <xpath expr="//div[hasclass('tncsc-hero-nav')]//a[@href='/contact']" position="after">
+            <t t-call="tncsc_deployment.website_member_login_button"/>
+        </xpath>
     </template>
 
     <template id="view_page_tamil_school_custom_header_only"
@@ -127,29 +130,346 @@
         </xpath>
     </template>
 
+    <!-- Shared Custom Temple Footer for Overridden Pages -->
+    <template id="tncsc_custom_footer" name="TNCSC Custom Temple Footer">
+        <footer id="tncscFooterSection" class="tncsc-custom-footer position-relative" style="background: linear-gradient(180deg, rgba(8, 16, 40, 0.65) 0%, rgba(10, 20, 50, 0.70) 100%), url('/tncsc_deployment/static/src/img/home/footer-bgwithclor.webp') center/cover no-repeat; padding: 60px 0 40px 0; color: #ffffff; text-align: center; display: block !important;">
+            <div class="container position-relative">
+                <!-- Emblem Logo -->
+                <img src="/tncsc_deployment/static/src/img/brand/logo.png" alt="TNCSC Logo" style="height: 90px; width: auto;" class="img-fluid mb-4"/>
+                
+                <!-- Description Copy -->
+                <p style="color: #CBD5E1; font-size: 1.02rem; line-height: 1.65; max-width: 760px;" class="mx-auto mb-4">
+                    For over 28+ years, the Tamil Nadu Cultural Society of Canada (TNCSC) has been a pillar for Tamil families across Canada – preserving language, celebrating tradition, and uniting generations through community events and cultural programs.
+                </p>
+
+                <!-- Footer Navigation Links -->
+                <div class="d-flex justify-content-center align-items-center gap-4 mb-4">
+                    <a href="/" class="text-white text-decoration-none fw-medium fs-6">Home</a>
+                    <span class="text-white-50">|</span>
+                    <a href="/about" class="text-white text-decoration-none fw-medium fs-6">About Us</a>
+                    <span class="text-white-50">|</span>
+                    <a href="/membership" class="text-white text-decoration-none fw-medium fs-6">Membership</a>
+                    <span class="text-white-50">|</span>
+                    <a href="/contact" class="text-white text-decoration-none fw-medium fs-6">Contact</a>
+                </div>
+
+                <!-- Horizontal Divider -->
+                <hr style="border-color: rgba(255, 255, 255, 0.15); max-width: 850px;" class="mx-auto my-4"/>
+
+                <!-- Social Icons -->
+                <div class="d-flex justify-content-center align-items-center gap-3 mt-3">
+                    <a href="https://www.facebook.com/TNCSCCanada/" target="_blank" rel="noopener" class="btn-tncsc-social" aria-label="Facebook" style="width: 48px; height: 48px; background-color: #D89C43; color: #ffffff !important; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 1.25rem; text-decoration: none !important;">
+                        <i class="fa fa-facebook"></i>
+                    </a>
+                    <a href="https://www.youtube.com/@tamilnaduculturalsocietyof5866" target="_blank" rel="noopener" class="btn-tncsc-social" aria-label="YouTube" style="width: 48px; height: 48px; background-color: #D89C43; color: #ffffff !important; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 1.25rem; text-decoration: none !important;">
+                        <i class="fa fa-youtube-play"></i>
+                    </a>
+                    <a href="https://www.instagram.com/tncsc_canada" target="_blank" rel="noopener" class="btn-tncsc-social" aria-label="Instagram" style="width: 48px; height: 48px; background-color: #D89C43; color: #ffffff !important; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 1.25rem; text-decoration: none !important;">
+                        <i class="fa fa-instagram"></i>
+                    </a>
+                </div>
+
+                <!-- Floating Back to Top Button -->
+                <a href="#wrap" class="position-absolute bottom-0 end-0 mb-3 me-3 d-inline-flex align-items-center justify-content-center" style="width: 44px; height: 44px; background-color: #D89C43; color: #ffffff; text-decoration: none; border-radius: 4px; box-shadow: 0 4px 10px rgba(0,0,0,0.3);" aria-label="Back to top">
+                    <i class="fa fa-arrow-up fs-5"></i>
+                </a>
+            </div>
+        </footer>
+    </template>
+
     <!-- School Registration Navigation & Branding -->
     <template id="tncsc_school_reg_header_nav" name="TNCSC School Registration Navigation">
-        <div class="tncsc-top-header" style="background-color: #120735; padding: 14px 20px; text-align: center;">
-            <h1 style="font-size: 1.55rem; font-weight: 700; color: #ffffff; margin: 0; line-height: 1.2;">தமிழ்நாடு கலாச்சார சங்கம்</h1>
-            <p style="font-size: 1.1rem; font-weight: 400; color: #B8B2E6; margin: 2px 0 0 0;">Tamil Nadu Cultural Society of Canada</p>
-        </div>
-        <nav class="navbar navbar-expand-lg navbar-dark" style="background-color: #1c0d48; border-bottom: 2px solid #e5a93c; padding: 8px 24px;">
-            <div class="container-fluid">
-                <a class="navbar-brand d-flex align-items-center gap-2" href="/">
-                    <img src="/tncsc_deployment/static/src/img/brand/logo.png" alt="TNCSC Logo" style="height: 38px; width: auto;"/>
-                    <span class="fw-bold text-white small d-none d-sm-inline">TNCSC</span>
-                </a>
-                <div class="d-flex align-items-center gap-2 ms-auto">
-                    <a href="/tamil-school" class="btn btn-outline-light btn-sm rounded-pill px-3">
-                        <i class="fa fa-graduation-cap me-1"></i> Tamil School
-                    </a>
-                    <a href="/membership/registration" class="btn btn-outline-warning btn-sm rounded-pill px-3">
-                        <i class="fa fa-id-card me-1"></i> Membership
-                    </a>
-                    <t t-call="tncsc_deployment.website_member_login_button"/>
+        <style>
+            .tncsc-top-header {
+                background-color: #120735;
+                padding: 14px 20px;
+                text-align: center;
+            }
+            .tncsc-top-header .brand-title-ta {
+                font-size: 1.55rem;
+                font-weight: 700;
+                color: #ffffff;
+                margin: 0;
+                line-height: 1.2;
+                font-family: var(--community-heading-font, sans-serif);
+            }
+            .tncsc-top-header .brand-subtitle-en {
+                font-size: 1.1rem;
+                font-weight: 400;
+                color: #B8B2E6;
+                margin: 2px 0 0 0;
+            }
+            .tncsc-hero-container {
+                position: relative;
+            }
+            .tncsc-hero-nav {
+                background: transparent !important;
+                padding: 16px 0;
+                border: none !important;
+                position: absolute;
+                top: 0;
+                left: 0;
+                right: 0;
+                z-index: 20;
+            }
+            .tncsc-hero-nav .nav-link {
+                color: #ffffff !important;
+                font-weight: 500;
+                font-size: 0.95rem;
+                padding: 6px 16px !important;
+                opacity: 0.92;
+                text-shadow: 0 1px 4px rgba(0, 0, 0, 0.6);
+                transition: opacity 0.2s;
+            }
+            .tncsc-hero-nav .nav-link:hover, .tncsc-hero-nav .nav-link.active {
+                opacity: 1;
+                color: #F5A623 !important;
+            }
+            .tncsc-dropdown {
+                position: relative;
+                display: inline-block;
+            }
+            .tncsc-dropdown-menu {
+                display: none;
+                position: absolute;
+                top: 100%;
+                left: 50%;
+                transform: translateX(-50%);
+                margin-top: 10px;
+                background-color: #ffffff;
+                min-width: 230px;
+                padding: 12px 0;
+                border-radius: 4px;
+                box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25);
+                z-index: 1000;
+                text-align: left;
+            }
+            .tncsc-dropdown-menu::before {
+                content: '';
+                position: absolute;
+                bottom: 100%;
+                left: 50%;
+                transform: translateX(-50%);
+                border-width: 8px;
+                border-style: solid;
+                border-color: transparent transparent #ffffff transparent;
+            }
+            .tncsc-dropdown:hover .tncsc-dropdown-menu {
+                display: block !important;
+            }
+            .tncsc-dropdown-item {
+                display: block;
+                padding: 10px 24px;
+                color: #5B6C8F !important;
+                font-weight: 600;
+                font-size: 0.95rem;
+                text-decoration: none;
+                transition: all 0.2s ease;
+                text-shadow: none !important;
+                white-space: nowrap;
+            }
+            .tncsc-dropdown-item:hover {
+                color: #D89C43 !important;
+                background-color: #F8FAFC;
+            }
+            .tncsc-hero-nav .nav-link.active {
+                border-bottom: 2px solid #F5A623;
+                font-weight: 600;
+            }
+            .btn-tncsc-gold {
+                background-color: #D89C43;
+                color: #ffffff !important;
+                font-weight: 600;
+                font-size: 0.92rem;
+                padding: 10px 24px;
+                position: relative;
+                border: none;
+                border-radius: 0;
+                display: inline-flex;
+                align-items: center;
+                gap: 8px;
+                text-decoration: none !important;
+                transition: all 0.25s ease;
+                box-shadow: 0 4px 14px rgba(0, 0, 0, 0.3);
+            }
+            .btn-tncsc-gold::before {
+                content: '';
+                position: absolute;
+                top: -5px;
+                right: -5px;
+                width: 14px;
+                height: 14px;
+                border-top: 2px solid #ffffff;
+                border-right: 2px solid #ffffff;
+            }
+            .btn-tncsc-gold::after {
+                content: '';
+                position: absolute;
+                bottom: -5px;
+                left: -5px;
+                width: 14px;
+                height: 14px;
+                border-bottom: 2px solid #ffffff;
+                border-left: 2px solid #ffffff;
+            }
+            .btn-tncsc-gold:hover {
+                background-color: #c48a35;
+                transform: translateY(-1px);
+            }
+            .tncsc-inner-hero {
+                background: linear-gradient(180deg, rgba(20, 10, 50, 0.85) 0%, rgba(30, 15, 70, 0.90) 100%), url('/tncsc_deployment/static/src/img/tamil_class/tamil-class-banner.webp') center/cover no-repeat;
+                padding: 140px 0 90px 0;
+                text-align: center;
+                position: relative;
+            }
+            .school-reg-card {
+                margin-top: 60px !important;
+                margin-bottom: 80px !important;
+                box-shadow: 0 15px 40px rgba(18, 7, 53, 0.08) !important;
+                border-radius: 18px !important;
+            }
+            #footer:not(.tncsc-custom-footer),
+            footer#bottom:not(.tncsc-custom-footer),
+            .o_footer,
+            .o_footer_copyright,
+            .s_footer,
+            #o_footer,
+            footer:not(.tncsc-custom-footer) {
+                display: none !important;
+            }
+            @media (max-width: 991px) {
+                .tncsc-hero-nav {
+                    position: relative !important;
+                    background: #120735 !important;
+                }
+                .tncsc-hero-nav .collapse {
+                    background: #120735;
+                    padding: 20px;
+                    border-radius: 8px;
+                    margin-top: 10px;
+                    box-shadow: 0 10px 30px rgba(0,0,0,0.3);
+                }
+                .tncsc-hero-nav nav {
+                    flex-direction: column;
+                    align-items: flex-start !important;
+                    gap: 15px !important;
+                    margin-bottom: 20px;
+                }
+            }
+            @media (max-width: 767px) {
+                .tncsc-top-header {
+                    padding: 10px;
+                }
+                .tncsc-top-header .brand-title-ta {
+                    font-size: 1.15rem;
+                }
+                .tncsc-top-header .brand-subtitle-en {
+                    font-size: 0.85rem;
+                }
+                .tncsc-top-header img {
+                    height: 44px !important;
+                    margin-right: 12px !important;
+                }
+                .tncsc-hero-nav .nav-link {
+                    padding: 6px 10px !important;
+                    font-size: 0.9rem;
+                }
+                .btn-tncsc-gold {
+                    padding: 8px 16px;
+                    font-size: 0.85rem;
+                }
+                .tncsc-custom-footer {
+                    padding: 40px 15px 30px 15px !important;
+                }
+                .tncsc-custom-footer img {
+                    height: 60px !important;
+                }
+                .tncsc-custom-footer .gap-3 {
+                    flex-wrap: wrap;
+                    gap: 10px !important;
+                }
+                .tncsc-inner-hero {
+                    padding: 120px 0 50px 0 !important;
+                }
+                .tncsc-inner-hero h1.display-3 {
+                    font-size: 2.2rem !important;
+                }
+                .school-reg-card {
+                    margin-top: 30px !important;
+                    padding: 24px 18px !important;
+                }
+            }
+        </style>
+
+        <!-- Top Header Banner with Emblem Logo and Bilingual Title -->
+        <div class="tncsc-top-header">
+            <div class="container d-flex align-items-center justify-content-center">
+                <img src="/tncsc_deployment/static/src/img/brand/logo.png" alt="TNCSC Logo" style="height: 64px; width: auto; margin-right: 18px;" class="img-fluid"/>
+                <div class="text-start">
+                    <h1 class="brand-title-ta">தமிழ்நாடு கலாச்சார சங்கம் - கனடா</h1>
+                    <p class="brand-subtitle-en">Tamil Nadu Cultural Society of Canada</p>
                 </div>
             </div>
-        </nav>
+        </div>
+
+        <!-- Hero Main Banner Section with Navigation Bar & Page Title -->
+        <div class="tncsc-hero-container">
+            <!-- Transparent Floating Navbar -->
+            <div class="tncsc-hero-nav">
+                <div class="container d-flex flex-wrap align-items-center justify-content-between">
+                    <!-- Mobile Toggle Button -->
+                    <div class="w-100 d-flex justify-content-end d-lg-none">
+                        <button class="navbar-toggler border-0 text-white fs-2" type="button" data-bs-toggle="collapse" data-bs-target="#tncscMobileMenuSchoolReg" aria-expanded="false" aria-label="Toggle navigation" style="background: transparent;">
+                            <i class="fa fa-bars"></i>
+                        </button>
+                    </div>
+
+                    <!-- Collapsible Menu -->
+                    <div class="collapse navbar-collapse d-lg-flex justify-content-between w-100" id="tncscMobileMenuSchoolReg">
+                        <nav class="d-flex align-items-center gap-1">
+                            <a href="/" class="nav-link">Home</a>
+                            <div class="tncsc-dropdown">
+                                <a href="/about" class="nav-link">About +</a>
+                                <div class="tncsc-dropdown-menu">
+                                    <a href="/about/tamil-nadu" class="tncsc-dropdown-item">Tamil Nadu</a>
+                                    <a href="/about/board-of-directors" class="tncsc-dropdown-item">Board Of Directors</a>
+                                </div>
+                            </div>
+                            <a href="/event" class="nav-link">Events</a>
+                            <div class="tncsc-dropdown">
+                                <a href="/membership" class="nav-link">Membership +</a>
+                                <div class="tncsc-dropdown-menu">
+                                    <a href="/membership/benefits" class="tncsc-dropdown-item">Membership Benefits</a>
+                                    <a href="/membership/registration" class="tncsc-dropdown-item">Membership Registration</a>
+                                </div>
+                            </div>
+                            <a href="/tamil-school" class="nav-link active">Tamil Class</a>
+                            <a href="/contact" class="nav-link">Contact</a>
+                        </nav>
+                        <div class="d-flex align-items-center gap-2 mt-3 mt-lg-0">
+                            <t t-call="tncsc_deployment.website_member_login_button"/>
+                            <a href="/event" class="btn-tncsc-gold py-2 px-3 align-self-start align-self-lg-center">
+                                <i class="fa fa-ticket"></i> View Event
+                            </a>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <!-- Inner Hero Title & Breadcrumb -->
+            <div class="tncsc-inner-hero">
+                <div class="container">
+                    <h1 class="display-3 fw-bold text-white mb-3" style="font-size: 3.5rem; text-shadow: 0 4px 12px rgba(0,0,0,0.5);">Tamil School Registration</h1>
+                    <div class="fs-5 text-white-50 fw-medium">
+                        <a href="/" class="text-white-50 text-decoration-none">Home</a>
+                        <span class="mx-2 text-white-50">|</span>
+                        <a href="/tamil-school" class="text-white-50 text-decoration-none">Tamil Class</a>
+                        <span class="mx-2 text-white-50">|</span>
+                        <span class="text-white">Registration</span>
+                    </div>
+                </div>
+            </div>
+        </div>
     </template>
 
     <template id="view_school_reg_step_parent_header" inherit_id="community_school.registration_step_parent" name="TNCSC School Reg Header Parent">
@@ -159,6 +479,10 @@
         <xpath expr="//div[@id='wrap']" position="before">
             <t t-call="tncsc_deployment.tncsc_school_reg_header_nav"/>
         </xpath>
+        <xpath expr="//div[hasclass('school-reg-hero')]" position="replace"/>
+        <xpath expr="//div[@id='wrap']" position="after">
+            <t t-call="tncsc_deployment.tncsc_custom_footer"/>
+        </xpath>
     </template>
 
     <template id="view_school_reg_step_student_header" inherit_id="community_school.registration_step_student" name="TNCSC School Reg Header Student">
@@ -168,6 +492,10 @@
         <xpath expr="//div[@id='wrap']" position="before">
             <t t-call="tncsc_deployment.tncsc_school_reg_header_nav"/>
         </xpath>
+        <xpath expr="//div[hasclass('school-reg-hero')]" position="replace"/>
+        <xpath expr="//div[@id='wrap']" position="after">
+            <t t-call="tncsc_deployment.tncsc_custom_footer"/>
+        </xpath>
     </template>
 
     <template id="view_school_reg_step_class_header" inherit_id="community_school.registration_step_class" name="TNCSC School Reg Header Class">
@@ -177,6 +505,10 @@
         <xpath expr="//div[@id='wrap']" position="before">
             <t t-call="tncsc_deployment.tncsc_school_reg_header_nav"/>
         </xpath>
+        <xpath expr="//div[hasclass('school-reg-hero')]" position="replace"/>
+        <xpath expr="//div[@id='wrap']" position="after">
+            <t t-call="tncsc_deployment.tncsc_custom_footer"/>
+        </xpath>
     </template>
 
     <template id="view_school_reg_done_header" inherit_id="community_school.registration_done" name="TNCSC School Reg Header Done">
@@ -186,6 +518,442 @@
         <xpath expr="//div[@id='wrap']" position="before">
             <t t-call="tncsc_deployment.tncsc_school_reg_header_nav"/>
         </xpath>
+        <xpath expr="//div[@id='wrap']" position="after">
+            <t t-call="tncsc_deployment.tncsc_custom_footer"/>
+        </xpath>
+    </template>
+
+    <!-- Event Detail & Registration Navigation & Branding -->
+    <template id="tncsc_event_detail_header_nav" name="TNCSC Event Detail Navigation &amp; Banner">
+        <style>
+            .tncsc-top-header {
+                background-color: #120735;
+                padding: 14px 20px;
+                text-align: center;
+            }
+            .tncsc-top-header .brand-title-ta {
+                font-size: 1.55rem;
+                font-weight: 700;
+                color: #ffffff;
+                margin: 0;
+                line-height: 1.2;
+                font-family: var(--community-heading-font, sans-serif);
+            }
+            .tncsc-top-header .brand-subtitle-en {
+                font-size: 1.1rem;
+                font-weight: 400;
+                color: #B8B2E6;
+                margin: 2px 0 0 0;
+            }
+            .tncsc-hero-container {
+                position: relative;
+            }
+            .tncsc-hero-nav {
+                background: transparent !important;
+                padding: 16px 0;
+                border: none !important;
+                position: absolute;
+                top: 0;
+                left: 0;
+                right: 0;
+                z-index: 20;
+            }
+            .tncsc-hero-nav .nav-link {
+                color: #ffffff !important;
+                font-weight: 500;
+                font-size: 0.95rem;
+                padding: 6px 16px !important;
+                opacity: 0.92;
+                text-shadow: 0 1px 4px rgba(0, 0, 0, 0.6);
+                transition: opacity 0.2s;
+            }
+            .tncsc-hero-nav .nav-link:hover, .tncsc-hero-nav .nav-link.active {
+                opacity: 1;
+                color: #F5A623 !important;
+            }
+            .tncsc-dropdown {
+                position: relative;
+                display: inline-block;
+            }
+            .tncsc-dropdown-menu {
+                display: none;
+                position: absolute;
+                top: 100%;
+                left: 50%;
+                transform: translateX(-50%);
+                margin-top: 10px;
+                background-color: #ffffff;
+                min-width: 230px;
+                padding: 12px 0;
+                border-radius: 4px;
+                box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25);
+                z-index: 1000;
+                text-align: left;
+            }
+            .tncsc-dropdown-menu::before {
+                content: '';
+                position: absolute;
+                bottom: 100%;
+                left: 50%;
+                transform: translateX(-50%);
+                border-width: 8px;
+                border-style: solid;
+                border-color: transparent transparent #ffffff transparent;
+            }
+            .tncsc-dropdown:hover .tncsc-dropdown-menu {
+                display: block !important;
+            }
+            .tncsc-dropdown-item {
+                display: block;
+                padding: 10px 24px;
+                color: #5B6C8F !important;
+                font-weight: 600;
+                font-size: 0.95rem;
+                text-decoration: none;
+                transition: all 0.2s ease;
+                text-shadow: none !important;
+                white-space: nowrap;
+            }
+            .tncsc-dropdown-item:hover {
+                color: #D89C43 !important;
+                background-color: #F8FAFC;
+            }
+            .tncsc-hero-nav .nav-link.active {
+                border-bottom: 2px solid #F5A623;
+                font-weight: 600;
+            }
+            .btn-tncsc-gold {
+                background-color: #D89C43;
+                color: #ffffff !important;
+                font-weight: 600;
+                font-size: 0.92rem;
+                padding: 10px 24px;
+                position: relative;
+                border: none;
+                border-radius: 0;
+                display: inline-flex;
+                align-items: center;
+                gap: 8px;
+                text-decoration: none !important;
+                transition: all 0.25s ease;
+                box-shadow: 0 4px 14px rgba(0, 0, 0, 0.3);
+            }
+            .btn-tncsc-gold::before {
+                content: '';
+                position: absolute;
+                top: -5px;
+                right: -5px;
+                width: 14px;
+                height: 14px;
+                border-top: 2px solid #ffffff;
+                border-right: 2px solid #ffffff;
+            }
+            .btn-tncsc-gold::after {
+                content: '';
+                position: absolute;
+                bottom: -5px;
+                left: -5px;
+                width: 14px;
+                height: 14px;
+                border-bottom: 2px solid #ffffff;
+                border-left: 2px solid #ffffff;
+            }
+            .btn-tncsc-gold:hover {
+                background-color: #c48a35;
+                transform: translateY(-1px);
+            }
+            .tncsc-inner-hero {
+                background: linear-gradient(180deg, rgba(20, 10, 50, 0.85) 0%, rgba(30, 15, 70, 0.90) 100%), url('/tncsc_deployment/static/src/img/events/event-banner.webp') center/cover no-repeat;
+                padding: 140px 0 90px 0;
+                text-align: center;
+                position: relative;
+            }
+
+            /* Event Page Content and Layout Upgrades */
+            #wrap.o_wevent_event {
+                background-color: #f7f8fc !important;
+                padding-top: 50px !important;
+                padding-bottom: 80px !important;
+                font-family: var(--community-font, 'Outfit', 'Inter', sans-serif);
+            }
+            #o_wevent_event_submenu {
+                display: none !important;
+            }
+            #o_wevent_event_main_col {
+                background: #ffffff !important;
+                border-radius: 18px !important;
+                border: 1px solid #e2e8f0 !important;
+                box-shadow: 0 10px 30px rgba(18, 7, 53, 0.06) !important;
+                padding: 40px !important;
+            }
+            #o_wevent_event_main_cover_content {
+                display: none !important;
+            }
+            .o_wevent_event_main_cover {
+                border-radius: 14px !important;
+                min-height: 240px !important;
+                max-height: 380px !important;
+                margin-bottom: 24px !important;
+                box-shadow: 0 6px 20px rgba(18, 7, 53, 0.08) !important;
+                overflow: hidden !important;
+            }
+            #o_wevent_event_main_col div[itemprop="description"] {
+                color: #334155;
+                font-size: 1.05rem;
+                line-height: 1.8;
+            }
+            #o_wevent_event_main_col div[itemprop="description"] h4,
+            #o_wevent_event_main_col div[itemprop="description"] h5 {
+                color: #120735;
+                font-weight: 700;
+            }
+
+            /* Event Sidebar Upgrades */
+            #o_wevent_event_main_sidebar {
+                padding-top: 0 !important;
+            }
+            #o_wevent_event_main_sidebar .alert-warning {
+                background: #fffbeb !important;
+                border: 1px solid #fde68a !important;
+                color: #92400e !important;
+                border-radius: 14px !important;
+                padding: 16px 20px !important;
+                font-weight: 600 !important;
+                font-size: 1rem !important;
+                box-shadow: 0 4px 12px rgba(245, 158, 11, 0.1) !important;
+                text-align: center;
+            }
+            #o_wevent_event_main_sidebar .o_wevent_sidebar_block,
+            #o_wevent_event_main_sidebar .o_wevent_bordered_block {
+                background: #ffffff !important;
+                border-radius: 16px !important;
+                border: 1px solid #e2e8f0 !important;
+                padding: 24px !important;
+                box-shadow: 0 6px 20px rgba(18, 7, 53, 0.05) !important;
+                margin-bottom: 20px !important;
+            }
+            #o_wevent_event_main_sidebar .o_wevent_sidebar_title {
+                color: #120735 !important;
+                font-weight: 700 !important;
+                font-size: 1.05rem !important;
+                text-transform: uppercase !important;
+                letter-spacing: 0.5px !important;
+                border-bottom: 2px solid #e5a93c !important;
+                padding-bottom: 8px !important;
+                margin-bottom: 16px !important;
+                display: inline-block;
+            }
+            #o_wevent_event_main_sidebar .btn-light {
+                background: #ffffff !important;
+                border: 1.5px solid #d19b33 !important;
+                color: #120735 !important;
+                font-weight: 600 !important;
+                border-radius: 30px !important;
+                padding: 8px 20px !important;
+                transition: all 0.2s ease !important;
+                display: inline-flex;
+                align-items: center;
+                gap: 6px;
+            }
+            #o_wevent_event_main_sidebar .btn-light:hover {
+                background: #e5a93c !important;
+                color: #ffffff !important;
+                transform: translateY(-2px);
+                box-shadow: 0 4px 12px rgba(229, 169, 60, 0.35);
+            }
+            .o_wevent_dates_block .card {
+                background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%) !important;
+                border: 1px solid #e2e8f0 !important;
+                border-left: 4px solid #e5a93c !important;
+                border-radius: 12px !important;
+                padding: 14px 18px !important;
+            }
+            .o_wevent_day_header_number {
+                font-size: 2.4rem !important;
+                font-weight: 800 !important;
+                color: #120735 !important;
+            }
+            .btn-primary.o_wevent_registration_btn,
+            #o_wevent_event_main a.btn-primary,
+            #o_wevent_event_main button.btn-primary {
+                background: linear-gradient(135deg, #e5a93c 0%, #d19b33 100%) !important;
+                border: 1px solid #d19b33 !important;
+                color: #120735 !important;
+                font-weight: 700 !important;
+                border-radius: 30px !important;
+                padding: 12px 28px !important;
+                box-shadow: 0 4px 14px rgba(229, 169, 60, 0.35) !important;
+                transition: all 0.25s ease !important;
+            }
+            .btn-primary.o_wevent_registration_btn:hover,
+            #o_wevent_event_main a.btn-primary:hover,
+            #o_wevent_event_main button.btn-primary:hover {
+                background: linear-gradient(135deg, #f3c669 0%, #e5a93c 100%) !important;
+                transform: translateY(-2px) !important;
+                box-shadow: 0 6px 18px rgba(229, 169, 60, 0.45) !important;
+                color: #120735 !important;
+            }
+
+            #footer:not(.tncsc-custom-footer),
+            footer#bottom:not(.tncsc-custom-footer),
+            .o_footer,
+            .o_footer_copyright,
+            .s_footer,
+            #o_footer,
+            footer:not(.tncsc-custom-footer) {
+                display: none !important;
+            }
+            @media (max-width: 991px) {
+                .tncsc-hero-nav {
+                    position: relative !important;
+                    background: #120735 !important;
+                }
+                .tncsc-hero-nav .collapse {
+                    background: #120735;
+                    padding: 20px;
+                    border-radius: 8px;
+                    margin-top: 10px;
+                    box-shadow: 0 10px 30px rgba(0,0,0,0.3);
+                }
+                .tncsc-hero-nav nav {
+                    flex-direction: column;
+                    align-items: flex-start !important;
+                    gap: 15px !important;
+                    margin-bottom: 20px;
+                }
+                #o_wevent_event_main_col {
+                    margin-bottom: 30px !important;
+                    padding: 24px !important;
+                }
+            }
+            @media (max-width: 767px) {
+                .tncsc-top-header {
+                    padding: 10px;
+                }
+                .tncsc-top-header .brand-title-ta {
+                    font-size: 1.15rem;
+                }
+                .tncsc-top-header .brand-subtitle-en {
+                    font-size: 0.85rem;
+                }
+                .tncsc-top-header img {
+                    height: 44px !important;
+                    margin-right: 12px !important;
+                }
+                .tncsc-hero-nav .nav-link {
+                    padding: 6px 10px !important;
+                    font-size: 0.9rem;
+                }
+                .btn-tncsc-gold {
+                    padding: 8px 16px;
+                    font-size: 0.85rem;
+                }
+                .tncsc-custom-footer {
+                    padding: 40px 15px 30px 15px !important;
+                }
+                .tncsc-custom-footer img {
+                    height: 60px !important;
+                }
+                .tncsc-custom-footer .gap-3 {
+                    flex-wrap: wrap;
+                    gap: 10px !important;
+                }
+                .tncsc-inner-hero {
+                    padding: 120px 0 50px 0 !important;
+                }
+                .tncsc-inner-hero h1.display-3 {
+                    font-size: 2.2rem !important;
+                }
+            }
+        </style>
+
+        <!-- Top Header Banner with Emblem Logo and Bilingual Title -->
+        <div class="tncsc-top-header">
+            <div class="container d-flex align-items-center justify-content-center">
+                <img src="/tncsc_deployment/static/src/img/brand/logo.png" alt="TNCSC Logo" style="height: 64px; width: auto; margin-right: 18px;" class="img-fluid"/>
+                <div class="text-start">
+                    <h1 class="brand-title-ta">தமிழ்நாடு கலாச்சார சங்கம் - கனடா</h1>
+                    <p class="brand-subtitle-en">Tamil Nadu Cultural Society of Canada</p>
+                </div>
+            </div>
+        </div>
+
+        <!-- Hero Main Banner Section with Navigation Bar & Page Title -->
+        <div class="tncsc-hero-container">
+            <!-- Transparent Floating Navbar -->
+            <div class="tncsc-hero-nav">
+                <div class="container d-flex flex-wrap align-items-center justify-content-between">
+                    <!-- Mobile Toggle Button -->
+                    <div class="w-100 d-flex justify-content-end d-lg-none">
+                        <button class="navbar-toggler border-0 text-white fs-2" type="button" data-bs-toggle="collapse" data-bs-target="#tncscMobileMenuEventDetail" aria-expanded="false" aria-label="Toggle navigation" style="background: transparent;">
+                            <i class="fa fa-bars"></i>
+                        </button>
+                    </div>
+
+                    <!-- Collapsible Menu -->
+                    <div class="collapse navbar-collapse d-lg-flex justify-content-between w-100" id="tncscMobileMenuEventDetail">
+                        <nav class="d-flex align-items-center gap-1">
+                            <a href="/" class="nav-link">Home</a>
+                            <div class="tncsc-dropdown">
+                                <a href="/about" class="nav-link">About +</a>
+                                <div class="tncsc-dropdown-menu">
+                                    <a href="/about/tamil-nadu" class="tncsc-dropdown-item">Tamil Nadu</a>
+                                    <a href="/about/board-of-directors" class="tncsc-dropdown-item">Board Of Directors</a>
+                                </div>
+                            </div>
+                            <a href="/event" class="nav-link active">Events</a>
+                            <div class="tncsc-dropdown">
+                                <a href="/membership" class="nav-link">Membership +</a>
+                                <div class="tncsc-dropdown-menu">
+                                    <a href="/membership/benefits" class="tncsc-dropdown-item">Membership Benefits</a>
+                                    <a href="/membership/registration" class="tncsc-dropdown-item">Membership Registration</a>
+                                </div>
+                            </div>
+                            <a href="/tamil-school" class="nav-link">Tamil Class</a>
+                            <a href="/contact" class="nav-link">Contact</a>
+                        </nav>
+                        <div class="d-flex align-items-center gap-2 mt-3 mt-lg-0">
+                            <t t-call="tncsc_deployment.website_member_login_button"/>
+                            <a href="/event" class="btn-tncsc-gold py-2 px-3 align-self-start align-self-lg-center">
+                                <i class="fa fa-ticket"></i> All Events
+                            </a>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <!-- Inner Hero Title & Breadcrumb -->
+            <div class="tncsc-inner-hero">
+                <div class="container">
+                    <h1 class="display-3 fw-bold text-white mb-2" style="font-size: 3.2rem; text-shadow: 0 4px 12px rgba(0,0,0,0.5);">
+                        <t t-if="event" t-out="event.name"/>
+                        <t t-else="">Events</t>
+                    </h1>
+                    <p t-if="event and event.subtitle" class="lead text-white-50 mb-3" style="font-size: 1.25rem;" t-out="event.subtitle"/>
+                    <div class="fs-5 text-white-50 fw-medium">
+                        <a href="/" class="text-white-50 text-decoration-none">Home</a>
+                        <span class="mx-2 text-white-50">|</span>
+                        <a href="/event" class="text-white-50 text-decoration-none">Events</a>
+                        <t t-if="event">
+                            <span class="mx-2 text-white-50">|</span>
+                            <span class="text-white" t-out="event.name"/>
+                        </t>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </template>
+
+    <template id="view_event_layout_custom_header" inherit_id="website_event.layout" name="TNCSC Event Layout Custom Header &amp; Footer">
+        <xpath expr="//t[@t-call='website.layout']" position="inside">
+            <t t-set="no_header" t-value="True"/>
+        </xpath>
+        <xpath expr="//div[@id='wrap']" position="before">
+            <t t-call="tncsc_deployment.tncsc_event_detail_header_nav"/>
+        </xpath>
+        <xpath expr="//div[@id='wrap']" position="after">
+            <t t-call="tncsc_deployment.tncsc_custom_footer"/>
+        </xpath>
     </template>
     <!-- Odoo's stock footer (shown on built-in pages such as event
          registration, login and school registration) ships demo content:
diff --git a/addons/tncsc_deployment/views/website_pages.xml b/addons/tncsc_deployment/views/website_pages.xml
index 1846db6..b717f47 100644
--- a/addons/tncsc_deployment/views/website_pages.xml
+++ b/addons/tncsc_deployment/views/website_pages.xml
@@ -3484,7 +3484,6 @@
                             </div>
                         </div>
 
- constant
                         <!-- Pricing Tiers Grid Section -->
                         <section class="registration-section">
                             <div class="container">
@@ -3712,21 +3711,218 @@
                                 font-family: var(--community-font, 'Outfit', 'Inter', sans-serif);
                                 min-height: 100vh;
                             }
-                            .tncsc-join-hero {
-                                background: linear-gradient(135deg, #120735 0%, #20104e 50%, #15093c 100%);
-                                padding: 60px 20px 45px 20px;
+                            .tncsc-top-header {
+                                background-color: #120735;
+                                padding: 14px 20px;
+                                text-align: center;
+                            }
+                            .tncsc-top-header .brand-title-ta {
+                                font-size: 1.55rem;
+                                font-weight: 700;
                                 color: #ffffff;
+                                margin: 0;
+                                line-height: 1.2;
+                                font-family: var(--community-heading-font, sans-serif);
+                            }
+                            .tncsc-top-header .brand-subtitle-en {
+                                font-size: 1.1rem;
+                                font-weight: 400;
+                                color: #B8B2E6;
+                                margin: 2px 0 0 0;
+                            }
+                            .tncsc-hero-container {
+                                position: relative;
+                            }
+                            .tncsc-hero-nav {
+                                background: transparent !important;
+                                padding: 16px 0;
+                                border: none !important;
+                                position: absolute;
+                                top: 0;
+                                left: 0;
+                                right: 0;
+                                z-index: 20;
+                            }
+                            .tncsc-hero-nav .nav-link {
+                                color: #ffffff !important;
+                                font-weight: 500;
+                                font-size: 0.95rem;
+                                padding: 6px 16px !important;
+                                opacity: 0.92;
+                                text-shadow: 0 1px 4px rgba(0, 0, 0, 0.6);
+                                transition: opacity 0.2s;
+                            }
+                            .tncsc-hero-nav .nav-link:hover, .tncsc-hero-nav .nav-link.active {
+                                opacity: 1;
+                                color: #F5A623 !important;
+                            }
+                            .tncsc-dropdown {
+                                position: relative;
+                                display: inline-block;
+                            }
+                            .tncsc-dropdown-menu {
+                                display: none;
+                                position: absolute;
+                                top: 100%;
+                                left: 50%;
+                                transform: translateX(-50%);
+                                margin-top: 10px;
+                                background-color: #ffffff;
+                                min-width: 230px;
+                                padding: 12px 0;
+                                border-radius: 4px;
+                                box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25);
+                                z-index: 1000;
+                                text-align: left;
+                            }
+                            .tncsc-dropdown-menu::before {
+                                content: '';
+                                position: absolute;
+                                bottom: 100%;
+                                left: 50%;
+                                transform: translateX(-50%);
+                                border-width: 8px;
+                                border-style: solid;
+                                border-color: transparent transparent #ffffff transparent;
+                            }
+                            .tncsc-dropdown:hover .tncsc-dropdown-menu {
+                                display: block !important;
+                            }
+                            .tncsc-dropdown-item {
+                                display: block;
+                                padding: 10px 24px;
+                                color: #5B6C8F !important;
+                                font-weight: 600;
+                                font-size: 0.95rem;
+                                text-decoration: none;
+                                transition: all 0.2s ease;
+                                text-shadow: none !important;
+                                white-space: nowrap;
+                            }
+                            .tncsc-dropdown-item:hover {
+                                color: #D89C43 !important;
+                                background-color: #F8FAFC;
+                            }
+                            .tncsc-hero-nav .nav-link.active {
+                                border-bottom: 2px solid #F5A623;
+                                font-weight: 600;
+                            }
+                            .btn-tncsc-gold {
+                                background-color: #D89C43;
+                                color: #ffffff !important;
+                                font-weight: 600;
+                                font-size: 0.92rem;
+                                padding: 10px 24px;
+                                position: relative;
+                                border: none;
+                                border-radius: 0;
+                                display: inline-flex;
+                                align-items: center;
+                                gap: 8px;
+                                text-decoration: none !important;
+                                transition: all 0.25s ease;
+                                box-shadow: 0 4px 14px rgba(0, 0, 0, 0.3);
+                            }
+                            .btn-tncsc-gold::before {
+                                content: '';
+                                position: absolute;
+                                top: -5px;
+                                right: -5px;
+                                width: 14px;
+                                height: 14px;
+                                border-top: 2px solid #ffffff;
+                                border-right: 2px solid #ffffff;
+                            }
+                            .btn-tncsc-gold::after {
+                                content: '';
+                                position: absolute;
+                                bottom: -5px;
+                                left: -5px;
+                                width: 14px;
+                                height: 14px;
+                                border-bottom: 2px solid #ffffff;
+                                border-left: 2px solid #ffffff;
+                            }
+                            .btn-tncsc-gold:hover {
+                                background-color: #c48a35;
+                                transform: translateY(-1px);
+                            }
+                            .tncsc-inner-hero {
+                                background: linear-gradient(180deg, rgba(20, 10, 50, 0.85) 0%, rgba(30, 15, 70, 0.90) 100%), url('/tncsc_deployment/static/src/img/membership/membership-banner.webp') center/cover no-repeat;
+                                padding: 140px 0 90px 0;
                                 text-align: center;
                                 position: relative;
                             }
-                            .tncsc-join-hero::after {
-                                content: "";
-                                position: absolute;
-                                bottom: 0;
-                                left: 0;
-                                right: 0;
-                                height: 4px;
-                                background: linear-gradient(90deg, #e5a93c, #f3c669, #e5a93c);
+                            #footer:not(.tncsc-custom-footer),
+                            footer#bottom:not(.tncsc-custom-footer),
+                            .o_footer,
+                            .o_footer_copyright,
+                            .s_footer,
+                            #o_footer,
+                            footer:not(.tncsc-custom-footer) {
+                                display: none !important;
+                            }
+                            @media (max-width: 991px) {
+                                .tncsc-hero-nav {
+                                    position: relative !important;
+                                    background: #120735 !important;
+                                }
+                                .tncsc-hero-nav .collapse {
+                                    background: #120735;
+                                    padding: 20px;
+                                    border-radius: 8px;
+                                    margin-top: 10px;
+                                    box-shadow: 0 10px 30px rgba(0,0,0,0.3);
+                                }
+                                .tncsc-hero-nav nav {
+                                    flex-direction: column;
+                                    align-items: flex-start !important;
+                                    gap: 15px !important;
+                                    margin-bottom: 20px;
+                                }
+                            }
+                            @media (max-width: 767px) {
+                                .tncsc-top-header {
+                                    padding: 10px;
+                                }
+                                .tncsc-top-header .brand-title-ta {
+                                    font-size: 1.15rem;
+                                }
+                                .tncsc-top-header .brand-subtitle-en {
+                                    font-size: 0.85rem;
+                                }
+                                .tncsc-top-header img {
+                                    height: 44px !important;
+                                    margin-right: 12px !important;
+                                }
+                                .tncsc-hero-nav .nav-link {
+                                    padding: 6px 10px !important;
+                                    font-size: 0.9rem;
+                                }
+                                .btn-tncsc-gold {
+                                    padding: 8px 16px;
+                                    font-size: 0.85rem;
+                                }
+                                .tncsc-custom-footer {
+                                    padding: 40px 15px 30px 15px !important;
+                                }
+                                .tncsc-custom-footer img {
+                                    height: 60px !important;
+                                }
+                                .tncsc-custom-footer .gap-3 {
+                                    flex-wrap: wrap;
+                                    gap: 10px !important;
+                                }
+                                .tncsc-inner-hero {
+                                    padding: 120px 0 50px 0 !important;
+                                }
+                                .tncsc-inner-hero h1.display-3 {
+                                    font-size: 2.2rem !important;
+                                }
+                                .tncsc-join-card {
+                                    margin-top: 35px !important;
+                                    padding: 24px 18px !important;
+                                }
                             }
                             .tncsc-join-card {
                                 background: #ffffff;
@@ -3734,8 +3930,8 @@
                                 border: 1px solid #e2e8f0;
                                 box-shadow: 0 10px 30px rgba(18, 7, 53, 0.06);
                                 padding: 35px 40px;
-                                margin-top: -30px;
-                                margin-bottom: 60px;
+                                margin-top: 60px;
+                                margin-bottom: 80px;
                                 position: relative;
                                 z-index: 10;
                             }
@@ -3820,14 +4016,70 @@
                             }
                         </style>
 
-                        <!-- Top Hero -->
-                        <div class="tncsc-join-hero">
-                            <div class="container">
-                                <span class="badge px-3 py-2 rounded-pill fw-bold mb-3" style="background-color: #e5a93c; color: #120735;">
-                                    OFFICIAL MEMBERSHIP REGISTRATION
-                                </span>
-                                <h1 class="display-5 fw-bold text-white mb-2">Tamil Nadu Cultural Society of Canada</h1>
-                                <p class="fs-5 mb-0" style="color: #c9c3ec;">தமிழ்நாடு கலாச்சார சங்கம் - உறுப்பினர் விண்ணப்பப் படிவம்</p>
+                        <!-- Top Header Banner with Emblem Logo and Bilingual Title -->
+                        <div class="tncsc-top-header">
+                            <div class="container d-flex align-items-center justify-content-center">
+                                <img src="/tncsc_deployment/static/src/img/brand/logo.png" alt="TNCSC Logo" style="height: 64px; width: auto; margin-right: 18px;" class="img-fluid"/>
+                                <div class="text-start">
+                                    <h1 class="brand-title-ta">தமிழ்நாடு கலாச்சார சங்கம் - கனடா</h1>
+                                    <p class="brand-subtitle-en">Tamil Nadu Cultural Society of Canada</p>
+                                </div>
+                            </div>
+                        </div>
+
+                        <!-- Hero Main Banner Section with Navigation Bar & Page Title -->
+                        <div class="tncsc-hero-container">
+                            <!-- Transparent Floating Navbar -->
+                            <div class="tncsc-hero-nav">
+                                <div class="container d-flex flex-wrap align-items-center justify-content-between">
+                                    <!-- Mobile Toggle Button -->
+                                    <div class="w-100 d-flex justify-content-end d-lg-none">
+                                        <button class="navbar-toggler border-0 text-white fs-2" type="button" data-bs-toggle="collapse" data-bs-target="#tncscMobileMenuMembershipJoin" aria-expanded="false" aria-label="Toggle navigation" style="background: transparent;">
+                                            <i class="fa fa-bars"></i>
+                                        </button>
+                                    </div>
+
+                                    <!-- Collapsible Menu -->
+                                    <div class="collapse navbar-collapse d-lg-flex justify-content-between w-100" id="tncscMobileMenuMembershipJoin">
+                                        <nav class="d-flex align-items-center gap-1">
+                                            <a href="/" class="nav-link">Home</a>
+                                            <div class="tncsc-dropdown">
+                                                <a href="/about" class="nav-link">About +</a>
+                                                <div class="tncsc-dropdown-menu">
+                                                    <a href="/about/tamil-nadu" class="tncsc-dropdown-item">Tamil Nadu</a>
+                                                    <a href="/about/board-of-directors" class="tncsc-dropdown-item">Board Of Directors</a>
+                                                </div>
+                                            </div>
+                                            <a href="/event" class="nav-link">Events</a>
+                                            <div class="tncsc-dropdown">
+                                                <a href="/membership" class="nav-link active">Membership +</a>
+                                                <div class="tncsc-dropdown-menu">
+                                                    <a href="/membership/benefits" class="tncsc-dropdown-item">Membership Benefits</a>
+                                                    <a href="/membership/registration" class="tncsc-dropdown-item">Membership Registration</a>
+                                                </div>
+                                            </div>
+                                            <a href="/tamil-school" class="nav-link">Tamil Class</a>
+                                            <a href="/contact" class="nav-link">Contact</a>
+                                        </nav>
+                                        <a href="/event" class="btn-tncsc-gold py-2 px-3 mt-3 mt-lg-0 align-self-start align-self-lg-center">
+                                            <i class="fa fa-ticket"></i> View Event
+                                        </a>
+                                    </div>
+                                </div>
+                            </div>
+
+                            <!-- Inner Hero Title & Breadcrumb -->
+                            <div class="tncsc-inner-hero">
+                                <div class="container">
+                                    <h1 class="display-3 fw-bold text-white mb-3" style="font-size: 3.5rem; text-shadow: 0 4px 12px rgba(0,0,0,0.5);">Membership Registration</h1>
+                                    <div class="fs-5 text-white-50 fw-medium">
+                                        <a href="/" class="text-white-50 text-decoration-none">Home</a>
+                                        <span class="mx-2 text-white-50">|</span>
+                                        <a href="/membership/registration" class="text-white-50 text-decoration-none">Membership</a>
+                                        <span class="mx-2 text-white-50">|</span>
+                                        <span class="text-white">Registration Form</span>
+                                    </div>
+                                </div>
                             </div>
                         </div>
 
@@ -4247,6 +4499,51 @@
                             </div>
                         </div>
 
+                        <!-- Custom Dark Temple Footer Section -->
+                        <footer id="tncscFooterSection" class="tncsc-custom-footer position-relative" style="background: linear-gradient(180deg, rgba(8, 16, 40, 0.65) 0%, rgba(10, 20, 50, 0.70) 100%), url('/tncsc_deployment/static/src/img/home/footer-bgwithclor.webp') center/cover no-repeat; padding: 60px 0 40px 0; color: #ffffff; text-align: center; display: block !important;">
+                            <div class="container position-relative">
+                                <!-- Emblem Logo -->
+                                <img src="/tncsc_deployment/static/src/img/brand/logo.png" alt="TNCSC Logo" style="height: 90px; width: auto;" class="img-fluid mb-4"/>
+                                
+                                <!-- Description Copy -->
+                                <p style="color: #CBD5E1; font-size: 1.02rem; line-height: 1.65; max-width: 760px;" class="mx-auto mb-4">
+                                    For over 28+ years, the Tamil Nadu Cultural Society of Canada (TNCSC) has been a pillar for Tamil families across Canada – preserving language, celebrating tradition, and uniting generations through community events and cultural programs.
+                                </p>
+
+                                <!-- Footer Navigation Links -->
+                                <div class="d-flex justify-content-center align-items-center gap-4 mb-4">
+                                    <a href="/" class="text-white text-decoration-none fw-medium fs-6">Home</a>
+                                    <span class="text-white-50">|</span>
+                                    <a href="/about" class="text-white text-decoration-none fw-medium fs-6">About Us</a>
+                                    <span class="text-white-50">|</span>
+                                    <a href="/membership" class="text-white text-decoration-none fw-medium fs-6">Membership</a>
+                                    <span class="text-white-50">|</span>
+                                    <a href="/contact" class="text-white text-decoration-none fw-medium fs-6">Contact</a>
+                                </div>
+
+                                <!-- Horizontal Divider -->
+                                <hr style="border-color: rgba(255, 255, 255, 0.15); max-width: 850px;" class="mx-auto my-4"/>
+
+                                <!-- Social Icons -->
+                                <div class="d-flex justify-content-center align-items-center gap-3 mt-3">
+                                    <a href="https://www.facebook.com/TNCSCCanada/" target="_blank" rel="noopener" class="btn-tncsc-social" aria-label="Facebook" style="width: 48px; height: 48px; background-color: #D89C43; color: #ffffff !important; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 1.25rem; text-decoration: none !important;">
+                                        <i class="fa fa-facebook"></i>
+                                    </a>
+                                    <a href="https://www.youtube.com/@tamilnaduculturalsocietyof5866" target="_blank" rel="noopener" class="btn-tncsc-social" aria-label="YouTube" style="width: 48px; height: 48px; background-color: #D89C43; color: #ffffff !important; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 1.25rem; text-decoration: none !important;">
+                                        <i class="fa fa-youtube-play"></i>
+                                    </a>
+                                    <a href="https://www.instagram.com/tncsc_canada" target="_blank" rel="noopener" class="btn-tncsc-social" aria-label="Instagram" style="width: 48px; height: 48px; background-color: #D89C43; color: #ffffff !important; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 1.25rem; text-decoration: none !important;">
+                                        <i class="fa fa-instagram"></i>
+                                    </a>
+                                </div>
+
+                                <!-- Floating Back to Top Button -->
+                                <a href="#wrap" class="position-absolute bottom-0 end-0 mb-3 me-3 d-inline-flex align-items-center justify-content-center" style="width: 44px; height: 44px; background-color: #D89C43; color: #ffffff; text-decoration: none; border-radius: 4px; box-shadow: 0 4px 10px rgba(0,0,0,0.3);" aria-label="Back to top">
+                                    <i class="fa fa-arrow-up fs-5"></i>
+                                </a>
+                            </div>
+                        </footer>
+
                         <!-- Live Validation & UI Logic -->
                         <script>
                             document.addEventListener('DOMContentLoaded', function () {