{"id":327,"date":"2026-01-30T16:44:36","date_gmt":"2026-01-30T10:59:36","guid":{"rendered":"https:\/\/www.dhakalankit.com.np\/?p=327"},"modified":"2026-04-13T14:33:32","modified_gmt":"2026-04-13T08:48:32","slug":"interactive-geological-divisions-of-nepal","status":"publish","type":"post","link":"https:\/\/www.dhakalankit.com.np\/en\/2026\/01\/30\/interactive-geological-divisions-of-nepal\/","title":{"rendered":"Interactive: Geological Divisions of Nepal"},"content":{"rendered":"\n<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n    <meta charset=\"UTF-8\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n    <title>Nepal Geological Divisions Widget<\/title>\n    <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\n    <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Nunito:wght@400;700;900&#038;display=swap\" rel=\"stylesheet\">\n    <style>\n        \/* Scoped Styles for WordPress Safety *\/\n        .geo-zones-widget {\n            font-family: 'Nunito', sans-serif;\n            background-color: transparent;\n        }\n\n        \/* Accordion Transition *\/\n        .geo-zones-widget .zone-content {\n            transition: max-height 0.4s ease-out, opacity 0.4s ease-out, padding 0.4s ease;\n            max-height: 0;\n            opacity: 0;\n            overflow: hidden;\n        }\n\n        .geo-zones-widget .zone-content.active {\n            max-height: 400px;\n            opacity: 1;\n        }\n\n        \/* Hover Effects *\/\n        .geo-zones-widget .zone-header {\n            transition: transform 0.2s ease, filter 0.2s ease;\n        }\n        .geo-zones-widget .zone-header:hover {\n            transform: scale(1.02);\n            filter: brightness(1.05);\n        }\n\n        \/* Thrust Line Styling *\/\n        .geo-thrust-line {\n            background-image: linear-gradient(to right, #ef4444 50%, transparent 50%);\n            background-size: 10px 2px;\n            background-repeat: repeat-x;\n        }\n    <\/style>\n<\/head>\n<body class=\"p-4 bg-gray-50\">\n\n    <!-- WIDGET START -->\n    <div class=\"geo-zones-widget max-w-md mx-auto\">\n        \n        <!-- Header -->\n        <div class=\"bg-slate-800 text-white p-6 rounded-t-3xl text-center shadow-lg relative overflow-hidden\">\n            <div class=\"absolute top-0 left-0 w-full h-2 bg-gradient-to-r from-purple-500 via-blue-500 to-green-500\"><\/div>\n            <h2 class=\"text-2xl font-black uppercase tracking-wide\">\ud83c\uddf3\ud83c\uddf5 Nepal Geology<\/h2>\n            <p class=\"text-slate-400 text-sm font-bold mt-1\">North-South Cross Section<\/p>\n        <\/div>\n\n        <!-- Widget Body -->\n        <div class=\"bg-white p-4 shadow-xl rounded-b-3xl border border-slate-200\">\n            \n            <!-- 1. TETHYS HIMALAYA (North) -->\n            <div class=\"geo-item mb-1\">\n                <div class=\"zone-header js-trigger cursor-pointer bg-purple-100 hover:bg-purple-200 p-4 rounded-xl flex items-center justify-between border-l-4 border-purple-500\">\n                    <div>\n                        <span class=\"text-xs font-black text-purple-600 uppercase tracking-widest\">North (Tibetan)<\/span>\n                        <h3 class=\"text-lg font-black text-slate-700\">Tethys Himalaya \ud83c\udfd4\ufe0f<\/h3>\n                    <\/div>\n                    <span class=\"text-purple-400 text-xl font-bold\">+<\/span>\n                <\/div>\n                <div class=\"zone-content js-content bg-purple-50 rounded-b-xl mx-2\">\n                    <div class=\"p-4 text-slate-700 text-sm\">\n                        <div class=\"flex items-center space-x-2 mb-2\">\n                            <span class=\"bg-purple-200 text-purple-800 text-xs font-bold px-2 py-1 rounded\">Sedimentary<\/span>\n                            <span class=\"bg-purple-200 text-purple-800 text-xs font-bold px-2 py-1 rounded\">Fossils<\/span>\n                        <\/div>\n                        <p>The &#8220;Tibetan&#8221; zone. Composed of fossil-rich sedimentary rocks (limestone, shale) deposited in the ancient Tethys Sea. It lies in the rain shadow.<\/p>\n                    <\/div>\n                <\/div>\n            <\/div>\n\n            <!-- THRUST: STDS -->\n            <div class=\"relative py-3 flex items-center justify-center group\" title=\"South Tibetan Detachment System\">\n                <div class=\"w-full h-[2px] geo-thrust-line\"><\/div>\n                <span class=\"absolute bg-white text-red-500 border-2 border-red-500 text-[10px] font-black px-2 py-0.5 rounded-full uppercase tracking-widest z-10 group-hover:bg-red-500 group-hover:text-white transition-colors cursor-help\">\n                    STDS\n                <\/span>\n            <\/div>\n\n            <!-- 2. HIGHER HIMALAYA -->\n            <div class=\"geo-item mb-1\">\n                <div class=\"zone-header js-trigger cursor-pointer bg-blue-100 hover:bg-blue-200 p-4 rounded-xl flex items-center justify-between border-l-4 border-blue-500\">\n                    <div>\n                        <span class=\"text-xs font-black text-blue-600 uppercase tracking-widest\">The Core<\/span>\n                        <h3 class=\"text-lg font-black text-slate-700\">Higher Himalaya \u2744\ufe0f<\/h3>\n                    <\/div>\n                    <span class=\"text-blue-400 text-xl font-bold\">+<\/span>\n                <\/div>\n                <div class=\"zone-content js-content bg-blue-50 rounded-b-xl mx-2\">\n                    <div class=\"p-4 text-slate-700 text-sm\">\n                        <div class=\"flex items-center space-x-2 mb-2\">\n                            <span class=\"bg-blue-200 text-blue-800 text-xs font-bold px-2 py-1 rounded\">Metamorphic<\/span>\n                            <span class=\"bg-blue-200 text-blue-800 text-xs font-bold px-2 py-1 rounded\">>3000m<\/span>\n                        <\/div>\n                        <p>The crystalline backbone. Contains high-grade metamorphic rocks (Gneiss) and granites. Home to the 8,000m giants like Everest and Annapurna.<\/p>\n                    <\/div>\n                <\/div>\n            <\/div>\n\n            <!-- THRUST: MCT -->\n            <div class=\"relative py-3 flex items-center justify-center group\" title=\"Main Central Thrust\">\n                <div class=\"w-full h-[2px] geo-thrust-line\"><\/div>\n                <span class=\"absolute bg-white text-red-500 border-2 border-red-500 text-[10px] font-black px-2 py-0.5 rounded-full uppercase tracking-widest z-10 group-hover:bg-red-500 group-hover:text-white transition-colors cursor-help\">\n                    MCT\n                <\/span>\n            <\/div>\n\n            <!-- 3. LESSER HIMALAYA -->\n            <div class=\"geo-item mb-1\">\n                <div class=\"zone-header js-trigger cursor-pointer bg-teal-100 hover:bg-teal-200 p-4 rounded-xl flex items-center justify-between border-l-4 border-teal-500\">\n                    <div>\n                        <span class=\"text-xs font-black text-teal-600 uppercase tracking-widest\">Middle Hills<\/span>\n                        <h3 class=\"text-lg font-black text-slate-700\">Lesser Himalaya \ud83c\udf0a<\/h3>\n                    <\/div>\n                    <span class=\"text-teal-400 text-xl font-bold\">+<\/span>\n                <\/div>\n                <div class=\"zone-content js-content bg-teal-50 rounded-b-xl mx-2\">\n                    <div class=\"p-4 text-slate-700 text-sm\">\n                        <div class=\"flex items-center space-x-2 mb-2\">\n                            <span class=\"bg-teal-200 text-teal-800 text-xs font-bold px-2 py-1 rounded\">Unfossiliferous<\/span>\n                            <span class=\"bg-teal-200 text-teal-800 text-xs font-bold px-2 py-1 rounded\">Valleys<\/span>\n                        <\/div>\n                        <p>The Mahabharat Range. Composed of older sedimentary and low-grade metamorphic rocks (Slate, Phyllite) with almost no fossils. Features deep valleys and terraced farming.<\/p>\n                    <\/div>\n                <\/div>\n            <\/div>\n\n            <!-- THRUST: MBT -->\n            <div class=\"relative py-3 flex items-center justify-center group\" title=\"Main Boundary Thrust\">\n                <div class=\"w-full h-[2px] geo-thrust-line\"><\/div>\n                <span class=\"absolute bg-white text-red-500 border-2 border-red-500 text-[10px] font-black px-2 py-0.5 rounded-full uppercase tracking-widest z-10 group-hover:bg-red-500 group-hover:text-white transition-colors cursor-help\">\n                    MBT\n                <\/span>\n            <\/div>\n\n            <!-- 4. SIWALIKS -->\n            <div class=\"geo-item mb-1\">\n                <div class=\"zone-header js-trigger cursor-pointer bg-amber-100 hover:bg-amber-200 p-4 rounded-xl flex items-center justify-between border-l-4 border-amber-500\">\n                    <div>\n                        <span class=\"text-xs font-black text-amber-600 uppercase tracking-widest\">Foothills<\/span>\n                        <h3 class=\"text-lg font-black text-slate-700\">Siwaliks (Chure) \ud83d\udc35<\/h3>\n                    <\/div>\n                    <span class=\"text-amber-400 text-xl font-bold\">+<\/span>\n                <\/div>\n                <div class=\"zone-content js-content bg-amber-50 rounded-b-xl mx-2\">\n                    <div class=\"p-4 text-slate-700 text-sm\">\n                        <div class=\"flex items-center space-x-2 mb-2\">\n                            <span class=\"bg-amber-200 text-amber-800 text-xs font-bold px-2 py-1 rounded\">Sandstone<\/span>\n                            <span class=\"bg-amber-200 text-amber-800 text-xs font-bold px-2 py-1 rounded\">Fragile<\/span>\n                        <\/div>\n                        <p>The youngest hills. Formed from river sediments (Molasse) rising up. Large number of fossils including <i>Ramapithecus<\/i>. Very fragile geology, prone to landslides.<\/p>\n                    <\/div>\n                <\/div>\n            <\/div>\n\n            <!-- THRUST: MFT -->\n            <div class=\"relative py-3 flex items-center justify-center group\" title=\"Main Frontal Thrust\">\n                <div class=\"w-full h-[2px] geo-thrust-line\"><\/div>\n                <span class=\"absolute bg-white text-red-500 border-2 border-red-500 text-[10px] font-black px-2 py-0.5 rounded-full uppercase tracking-widest z-10 group-hover:bg-red-500 group-hover:text-white transition-colors cursor-help\">\n                    MFT\n                <\/span>\n            <\/div>\n\n            <!-- 5. TERAI (South) -->\n            <div class=\"geo-item\">\n                <div class=\"zone-header js-trigger cursor-pointer bg-emerald-100 hover:bg-emerald-200 p-4 rounded-xl flex items-center justify-between border-l-4 border-emerald-500\">\n                    <div>\n                        <span class=\"text-xs font-black text-emerald-600 uppercase tracking-widest\">South (Plains)<\/span>\n                        <h3 class=\"text-lg font-black text-slate-700\">Terai \/ Gangetic Plain \ud83c\udf3e<\/h3>\n                    <\/div>\n                    <span class=\"text-emerald-400 text-xl font-bold\">+<\/span>\n                <\/div>\n                <div class=\"zone-content js-content bg-emerald-50 rounded-b-xl mx-2\">\n                    <div class=\"p-4 text-slate-700 text-sm\">\n                        <div class=\"flex items-center space-x-2 mb-2\">\n                            <span class=\"bg-emerald-200 text-emerald-800 text-xs font-bold px-2 py-1 rounded\">Alluvium<\/span>\n                            <span class=\"bg-emerald-200 text-emerald-800 text-xs font-bold px-2 py-1 rounded\">< 200m<\/span>\n                        <\/div>\n                        <p>The granary of Nepal. Flat, fertile plains composed of recent sediment deposits (gravel, sand, silt) from the Himalayas.<\/p>\n                    <\/div>\n                <\/div>\n            <\/div>\n\n        <\/div>\n        \n        <div class=\"text-center mt-4\">\n            <p class=\"text-xs font-bold text-slate-400\">Click zones to expand \u2022 Dotted red lines are thrust faults<\/p>\n        <\/div>\n\n    <\/div>\n    <!-- WIDGET END -->\n\n    <script>\n        (function() {\n            \/\/ Modular initialization function\n            function initGeoWidget(widget) {\n                if (widget.hasAttribute('data-initialized')) return;\n                widget.setAttribute('data-initialized', 'true');\n\n                const items = widget.querySelectorAll('.geo-item');\n\n                items.forEach(item => {\n                    const trigger = item.querySelector('.js-trigger');\n                    const content = item.querySelector('.js-content');\n                    const plusSign = trigger.querySelector('span:last-child');\n\n                    trigger.addEventListener('click', () => {\n                        const isActive = content.classList.contains('active');\n\n                        \/\/ 1. Close ALL items in this specific widget first (Accordion behavior)\n                        items.forEach(otherItem => {\n                            const otherContent = otherItem.querySelector('.js-content');\n                            const otherPlus = otherItem.querySelector('.js-trigger span:last-child');\n                            \n                            otherContent.classList.remove('active');\n                            otherPlus.textContent = '+';\n                            otherPlus.classList.remove('transform', 'rotate-45');\n                        });\n\n                        \/\/ 2. If it wasn't active before, open it now\n                        if (!isActive) {\n                            content.classList.add('active');\n                            plusSign.textContent = '\u2212'; \/\/ Minus sign\n                        }\n                    });\n                });\n            }\n\n            \/\/ Find and init all widgets\n            function initAllGeoWidgets() {\n                const widgets = document.querySelectorAll('.geo-zones-widget');\n                widgets.forEach(initGeoWidget);\n            }\n\n            \/\/ Init on load\n            if (document.readyState === 'loading') {\n                document.addEventListener('DOMContentLoaded', initAllGeoWidgets);\n            } else {\n                initAllGeoWidgets();\n            }\n            \n            \/\/ Backup init for dynamic content\n            setInterval(initAllGeoWidgets, 1000);\n\n        })();\n    <\/script>\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>Nepal Geological Divisions Widget \ud83c\uddf3\ud83c\uddf5 Nepal Geology North-South Cross Section North (Tibetan) Tethys Himalaya \ud83c\udfd4\ufe0f + Sedimentary Fossils The &#8220;Tibetan&#8221; zone. Composed of fossil-rich sedimentary rocks (limestone, shale) deposited in the ancient Tethys Sea. It lies in the rain shadow. STDS The Core Higher Himalaya \u2744\ufe0f + Metamorphic >3000m The crystalline backbone. Contains high-grade metamorphic [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":337,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[42,22,23],"tags":[44,27,43],"class_list":["post-327","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-geology-interactive","category-geology","category-geology-of-nepal","tag-geological-divisions-of-nepal-himalaya","tag-geology","tag-geology-of-nepal"],"jetpack_featured_media_url":"https:\/\/www.dhakalankit.com.np\/wp-content\/uploads\/2026\/01\/Screenshot-2026-01-30-164641.png","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.dhakalankit.com.np\/en\/wp-json\/wp\/v2\/posts\/327","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.dhakalankit.com.np\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.dhakalankit.com.np\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.dhakalankit.com.np\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.dhakalankit.com.np\/en\/wp-json\/wp\/v2\/comments?post=327"}],"version-history":[{"count":4,"href":"https:\/\/www.dhakalankit.com.np\/en\/wp-json\/wp\/v2\/posts\/327\/revisions"}],"predecessor-version":[{"id":371,"href":"https:\/\/www.dhakalankit.com.np\/en\/wp-json\/wp\/v2\/posts\/327\/revisions\/371"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.dhakalankit.com.np\/en\/wp-json\/wp\/v2\/media\/337"}],"wp:attachment":[{"href":"https:\/\/www.dhakalankit.com.np\/en\/wp-json\/wp\/v2\/media?parent=327"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.dhakalankit.com.np\/en\/wp-json\/wp\/v2\/categories?post=327"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.dhakalankit.com.np\/en\/wp-json\/wp\/v2\/tags?post=327"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}