radiacal-advaita / index.html
druvx13's picture
Add 3 files
a25970c verified
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Gaudapada's Radical Advaita</title>
<script src="https://cdn.tailwindcss.com"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
<style>
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif:wght@400;700&family=Playfair+Display:wght@700&display=swap');
:root {
--primary: #1a365d;
--secondary: #d69e2e;
--accent: #4a5568;
--light: #f7fafc;
--dark: #1a202c;
}
body {
font-family: 'Noto Serif', serif;
background-color: #f8f5f2;
color: var(--dark);
line-height: 1.6;
}
.sanskrit {
font-family: 'Noto Serif Devanagari', 'Noto Serif', serif;
}
.quote-icon {
opacity: 0.1;
font-size: 5rem;
position: absolute;
z-index: 0;
}
.nav-link {
position: relative;
}
.nav-link::after {
content: '';
position: absolute;
width: 0;
height: 2px;
bottom: -2px;
left: 0;
background-color: var(--secondary);
transition: width 0.3s ease;
}
.nav-link:hover::after {
width: 100%;
}
.fade-in {
animation: fadeIn 1s ease-in;
}
@keyframes fadeIn {
from { opacity: 0; transform: translateY(20px); }
to { opacity: 1; transform: translateY(0); }
}
.section-highlight {
background: linear-gradient(90deg, rgba(214,158,46,0.1) 0%, rgba(255,255,255,0) 100%);
border-left: 4px solid var(--secondary);
}
</style>
</head>
<body class="bg-gray-50">
<!-- Header with animated background -->
<header class="relative overflow-hidden bg-gradient-to-br from-blue-900 to-blue-800 text-white py-16 shadow-lg">
<div class="absolute inset-0 opacity-20">
<div class="absolute inset-0 bg-[url('https://upload.wikimedia.org/wikipedia/commons/thumb/7/73/Mandala.svg/1200px-Mandala.svg.png')] bg-cover bg-center opacity-30"></div>
</div>
<div class="container mx-auto px-6 relative z-10 text-center">
<h1 class="text-4xl md:text-5xl font-bold mb-4 font-serif">Gaudapada's Absolute Non-Dualism</h1>
<p class="text-xl md:text-2xl text-yellow-200 mb-6">The Most Radical Expression of Advaita Vedānta</p>
<div class="flex justify-center space-x-4">
<button onclick="scrollToSection('introduction')" class="px-6 py-2 bg-yellow-600 hover:bg-yellow-700 rounded-full text-white font-medium transition-all duration-300 transform hover:scale-105">
Begin Journey
</button>
<button onclick="toggleDarkMode()" class="px-6 py-2 bg-blue-800 hover:bg-blue-900 rounded-full text-white font-medium transition-all duration-300">
<i class="fas fa-moon mr-2"></i>Dark Mode
</button>
</div>
</div>
<div class="absolute bottom-0 left-0 right-0 h-2 bg-gradient-to-r from-yellow-600 via-yellow-400 to-yellow-600"></div>
</header>
<!-- Navigation -->
<nav class="sticky top-0 z-50 bg-white shadow-md">
<div class="container mx-auto px-6 py-3">
<div class="flex flex-wrap justify-center md:justify-between items-center">
<div class="hidden md:block">
<span class="text-gray-700 font-medium"><span class="sanskrit">गौडपाद</span> Gaudapāda</span>
</div>
<div class="flex space-x-1 md:space-x-6 overflow-x-auto py-2 scrollbar-hide">
<a href="#introduction" class="nav-link px-3 py-1 text-gray-700 hover:text-blue-800 font-medium transition-colors duration-300">Introduction</a>
<a href="#life" class="nav-link px-3 py-1 text-gray-700 hover:text-blue-800 font-medium transition-colors duration-300">Life</a>
<a href="#karika" class="nav-link px-3 py-1 text-gray-700 hover:text-blue-800 font-medium transition-colors duration-300">Māṇḍūkya Kārikā</a>
<a href="#ajativada" class="nav-link px-3 py-1 text-gray-700 hover:text-blue-800 font-medium transition-colors duration-300">Ajātivāda</a>
<a href="#extremism" class="nav-link px-3 py-1 text-gray-700 hover:text-blue-800 font-medium transition-colors duration-300">Radical Views</a>
<a href="#influence" class="nav-link px-3 py-1 text-gray-700 hover:text-blue-800 font-medium transition-colors duration-300">Legacy</a>
</div>
</div>
</div>
</nav>
<!-- Main Content -->
<main class="container mx-auto px-6 py-12">
<!-- Introduction Section -->
<section id="introduction" class="mb-20 fade-in">
<div class="flex items-center mb-8">
<div class="h-px bg-yellow-600 flex-1"></div>
<h2 class="text-3xl font-serif font-bold mx-4 text-center text-blue-900">Introduction</h2>
<div class="h-px bg-yellow-600 flex-1"></div>
</div>
<div class="grid md:grid-cols-2 gap-8 items-center">
<div>
<p class="text-lg mb-6 text-gray-700 leading-relaxed">
Gaudapāda (6th-7th century CE) represents the most radical, uncompromising expression of Advaita Vedānta. His commentary on the Māṇḍūkya Upaniṣad - the <span class="sanskrit">माण्डूक्यकारिका</span> (Māṇḍūkya Kārikā) - presents non-dualism in its purest form, eliminating even the subtlest traces of duality through the doctrine of absolute non-origination (<span class="sanskrit">अजातिवाद</span> Ajātivāda).
</p>
<button onclick="playAudio('intro')" class="flex items-center text-blue-800 hover:text-blue-600 mb-6">
<i class="fas fa-volume-up mr-2"></i> Hear Sanskrit Pronunciation
</button>
<audio id="intro-audio" src="https://www.sanskritweb.net/itrans/mandukya.mp3"></audio>
</div>
<div class="relative bg-white p-8 rounded-lg shadow-lg section-highlight">
<i class="quote-icon fas fa-quote-left text-yellow-200 top-2 left-4"></i>
<blockquote class="relative z-10 italic text-xl text-gray-800 leading-relaxed">
"There is no dissolution, no origination, no bondage, and no liberation. There is no imperative for spiritual practice, and no seeker of liberation."
<footer class="mt-4 not-italic text-yellow-700 font-medium">— Māṇḍūkya Kārikā 2.32</footer>
</blockquote>
</div>
</div>
<div class="mt-12 bg-blue-50 p-6 rounded-lg border-l-4 border-blue-800">
<h3 class="text-xl font-semibold text-blue-900 mb-4">Key Concepts</h3>
<div class="grid md:grid-cols-3 gap-4">
<div class="bg-white p-4 rounded shadow hover:shadow-md transition-shadow">
<div class="text-yellow-600 mb-2"><i class="fas fa-infinity text-2xl"></i></div>
<h4 class="font-bold text-blue-800">Non-Duality</h4>
<p class="text-gray-600 text-sm">Absolute oneness without any second</p>
</div>
<div class="bg-white p-4 rounded shadow hover:shadow-md transition-shadow">
<div class="text-yellow-600 mb-2"><i class="fas fa-mountain text-2xl"></i></div>
<h4 class="font-bold text-blue-800">Ajātivāda</h4>
<p class="text-gray-600 text-sm">The doctrine of non-origination</p>
</div>
<div class="bg-white p-4 rounded shadow hover:shadow-md transition-shadow">
<div class="text-yellow-600 mb-2"><i class="fas fa-eye-slash text-2xl"></i></div>
<h4 class="font-bold text-blue-800">Vivarta</h4>
<p class="text-gray-600 text-sm">Illusory appearance without reality</p>
</div>
</div>
</div>
</section>
<!-- Life Section -->
<section id="life" class="mb-20 fade-in">
<div class="flex items-center mb-8">
<div class="h-px bg-yellow-600 flex-1"></div>
<h2 class="text-3xl font-serif font-bold mx-4 text-center text-blue-900">Life and Historical Context</h2>
<div class="h-px bg-yellow-600 flex-1"></div>
</div>
<div class="grid md:grid-cols-2 gap-8">
<div>
<p class="text-lg mb-6 text-gray-700 leading-relaxed">
Little is known about Gaudapāda's life. He was the <span class="sanskrit">परमगुरु</span> (paramaguru, grandteacher) of Ādi Śaṅkarācārya and likely lived in the 6th-7th century CE. His philosophical system predates and profoundly influenced classical Advaita Vedānta.
</p>
<div class="bg-white p-6 rounded-lg shadow-md mb-6">
<h3 class="text-xl font-semibold text-blue-800 mb-4">Historical Timeline</h3>
<div class="space-y-4">
<div class="flex">
<div class="flex-shrink-0 mr-4">
<div class="flex items-center justify-center h-10 w-10 rounded-full bg-yellow-100 text-yellow-800">
<i class="fas fa-landmark"></i>
</div>
</div>
<div>
<h4 class="font-medium text-gray-800">Pre-Śaṅkara Period</h4>
<p class="text-sm text-gray-600">Developed before Buddhist logic became dominant</p>
</div>
</div>
<div class="flex">
<div class="flex-shrink-0 mr-4">
<div class="flex items-center justify-center h-10 w-10 rounded-full bg-blue-100 text-blue-800">
<i class="fas fa-book"></i>
</div>
</div>
<div>
<h4 class="font-medium text-gray-800">Māṇḍūkya Kārikā</h4>
<p class="text-sm text-gray-600">First systematic exposition of Advaita</p>
</div>
</div>
<div class="flex">
<div class="flex-shrink-0 mr-4">
<div class="flex items-center justify-center h-10 w-10 rounded-full bg-green-100 text-green-800">
<i class="fas fa-users"></i>
</div>
</div>
<div>
<h4 class="font-medium text-gray-800">Influence</h4>
<p class="text-sm text-gray-600">Shaped Śaṅkara's later formulations</p>
</div>
</div>
</div>
</div>
</div>
<div>
<div class="bg-white p-6 rounded-lg shadow-md">
<h3 class="text-xl font-semibold text-blue-800 mb-4">Key Characteristics</h3>
<ul class="space-y-3">
<li class="flex items-start">
<div class="flex-shrink-0 mt-1">
<div class="h-5 w-5 rounded-full bg-yellow-100 flex items-center justify-center">
<i class="fas fa-check text-yellow-600 text-xs"></i>
</div>
</div>
<p class="ml-3 text-gray-700">Pre-dates Buddhist logic and dialectics</p>
</li>
<li class="flex items-start">
<div class="flex-shrink-0 mt-1">
<div class="h-5 w-5 rounded-full bg-yellow-100 flex items-center justify-center">
<i class="fas fa-check text-yellow-600 text-xs"></i>
</div>
</div>
<p class="ml-3 text-gray-700">Rejects all forms of causation</p>
</li>
<li class="flex items-start">
<div class="flex-shrink-0 mt-1">
<div class="h-5 w-5 rounded-full bg-yellow-100 flex items-center justify-center">
<i class="fas fa-check text-yellow-600 text-xs"></i>
</div>
</div>
<p class="ml-3 text-gray-700">Denies even the provisional reality of Māyā</p>
</li>
<li class="flex items-start">
<div class="flex-shrink-0 mt-1">
<div class="h-5 w-5 rounded-full bg-yellow-100 flex items-center justify-center">
<i class="fas fa-check text-yellow-600 text-xs"></i>
</div>
</div>
<p class="ml-3 text-gray-700">Teaches absolute non-dualism without gradations</p>
</li>
</ul>
</div>
<div class="mt-6 bg-yellow-50 p-4 rounded-lg border-l-4 border-yellow-600">
<div class="flex">
<div class="flex-shrink-0">
<i class="fas fa-lightbulb text-yellow-600 mt-1"></i>
</div>
<div class="ml-3">
<p class="text-sm text-yellow-900">
Gaudapāda's teachings represent the purest form of Advaita, unmodified by later concessions to conventional reality.
</p>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Karika Section -->
<section id="karika" class="mb-20 fade-in">
<div class="flex items-center mb-8">
<div class="h-px bg-yellow-600 flex-1"></div>
<h2 class="text-3xl font-serif font-bold mx-4 text-center text-blue-900">Māṇḍūkya Kārikā</h2>
<div class="h-px bg-yellow-600 flex-1"></div>
</div>
<div class="grid md:grid-cols-2 gap-8">
<div class="bg-white p-8 rounded-lg shadow-lg">
<h3 class="text-2xl font-serif font-bold text-blue-800 mb-6">The Four Chapters</h3>
<div class="space-y-6">
<div class="flex">
<div class="flex-shrink-0 mt-1">
<span class="h-8 w-8 rounded-full bg-blue-800 text-white flex items-center justify-center font-bold">1</span>
</div>
<div class="ml-4">
<h4 class="text-lg font-bold text-gray-800"><span class="sanskrit">आगमप्रकरण</span> (Āgama Prakaraṇa)</h4>
<p class="text-gray-600 mt-1">Scriptural exposition establishing non-duality through Upaniṣadic texts</p>
</div>
</div>
<div class="flex">
<div class="flex-shrink-0 mt-1">
<span class="h-8 w-8 rounded-full bg-blue-800 text-white flex items-center justify-center font-bold">2</span>
</div>
<div class="ml-4">
<h4 class="text-lg font-bold text-gray-800"><span class="sanskrit">वैतथ्यप्रकरण</span> (Vaitathya Prakaraṇa)</h4>
<p class="text-gray-600 mt-1">Analysis of the world as unreal, like a dream or illusion</p>
</div>
</div>
<div class="flex">
<div class="flex-shrink-0 mt-1">
<span class="h-8 w-8 rounded-full bg-blue-800 text-white flex items-center justify-center font-bold">3</span>
</div>
<div class="ml-4">
<h4 class="text-lg font-bold text-gray-800"><span class="sanskrit">अद्वैतप्रकरण</span> (Advaita Prakaraṇa)</h4>
<p class="text-gray-600 mt-1">Non-dual exposition refuting all dualistic positions</p>
</div>
</div>
<div class="flex">
<div class="flex-shrink-0 mt-1">
<span class="h-8 w-8 rounded-full bg-blue-800 text-white flex items-center justify-center font-bold">4</span>
</div>
<div class="ml-4">
<h4 class="text-lg font-bold text-gray-800"><span class="sanskrit">अलातशान्तिप्रकरण</span> (Alātaśānti Prakaraṇa)</h4>
<p class="text-gray-600 mt-1">Refutation of all phenomena using the analogy of a firebrand's circle</p>
</div>
</div>
</div>
</div>
<div>
<div class="relative bg-blue-900 text-white p-8 rounded-lg shadow-lg mb-6 h-full">
<i class="quote-icon fas fa-om top-4 right-4 text-blue-700"></i>
<div class="relative z-10">
<h3 class="text-xl font-bold mb-4">The Essence of the Kārikā</h3>
<p class="mb-4 leading-relaxed">
This text demonstrates how all phenomena are mere appearances (<span class="sanskrit">विवर्त</span> vivarta) of Pure Consciousness, never truly originating or existing. Gaudapāda systematically eliminates every possible conceptual foothold for duality.
</p>
<div class="bg-blue-800 p-4 rounded">
<p class="italic">
"Just as a rope in the dark is imagined to be a snake or a stream, so too is the Self imagined in various ways."
</p>
<p class="text-right text-blue-200 mt-2">— Māṇḍūkya Kārikā 2.17-18</p>
</div>
</div>
</div>
</div>
</div>
<div class="mt-12">
<h3 class="text-2xl font-serif font-bold text-center text-blue-900 mb-8">Comparative Analysis</h3>
<div class="overflow-x-auto">
<table class="min-w-full bg-white rounded-lg overflow-hidden shadow">
<thead class="bg-blue-800 text-white">
<tr>
<th class="py-3 px-4 text-left">Concept</th>
<th class="py-3 px-4 text-left">Gaudapāda</th>
<th class="py-3 px-4 text-left">Later Advaita</th>
</tr>
</thead>
<tbody class="divide-y divide-gray-200">
<tr>
<td class="py-3 px-4 font-medium">Māyā</td>
<td class="py-3 px-4">Completely rejected</td>
<td class="py-3 px-4">Accepted provisionally</td>
</tr>
<tr class="bg-gray-50">
<td class="py-3 px-4 font-medium">Spiritual Practice</td>
<td class="py-3 px-4">Ultimately meaningless</td>
<td class="py-3 px-4">Necessary for realization</td>
</tr>
<tr>
<td class="py-3 px-4 font-medium">Duality</td>
<td class="py-3 px-4">Never existed</td>
<td class="py-3 px-4">Appears real until realization</td>
</tr>
</tbody>
</table>
</div>
</div>
</section>
<!-- Ajativada Section -->
<section id="ajativada" class="mb-20 fade-in">
<div class="flex items-center mb-8">
<div class="h-px bg-yellow-600 flex-1"></div>
<h2 class="text-3xl font-serif font-bold mx-4 text-center text-blue-900">Ajātivāda: The Doctrine of Non-Origination</h2>
<div class="h-px bg-yellow-600 flex-1"></div>
</div>
<div class="grid md:grid-cols-2 gap-8 mb-12">
<div>
<div class="bg-white p-8 rounded-lg shadow-lg h-full">
<h3 class="text-2xl font-serif font-bold text-blue-800 mb-6">Core Principles</h3>
<ul class="space-y-4">
<li class="flex items-start">
<div class="flex-shrink-0 mt-1">
<div class="h-6 w-6 rounded-full bg-yellow-100 flex items-center justify-center">
<i class="fas fa-ban text-yellow-600 text-sm"></i>
</div>
</div>
<p class="ml-3 text-gray-700">Nothing ever truly comes into existence</p>
</li>
<li class="flex items-start">
<div class="flex-shrink-0 mt-1">
<div class="h-6 w-6 rounded-full bg-yellow-100 flex items-center justify-center">
<i class="fas fa-ban text-yellow-600 text-sm"></i>
</div>
</div>
<p class="ml-3 text-gray-700">Birth, death, and change are illusory appearances</p>
</li>
<li class="flex items-start">
<div class="flex-shrink-0 mt-1">
<div class="h-6 w-6 rounded-full bg-yellow-100 flex items-center justify-center">
<i class="fas fa-ban text-yellow-600 text-sm"></i>
</div>
</div>
<p class="ml-3 text-gray-700">Even the concept of Māyā is ultimately rejected</p>
</li>
<li class="flex items-start">
<div class="flex-shrink-0 mt-1">
<div class="h-6 w-6 rounded-full bg-yellow-100 flex items-center justify-center">
<i class="fas fa-ban text-yellow-600 text-sm"></i>
</div>
</div>
<p class="ml-3 text-gray-700">There is no creator, creation, or dissolution</p>
</li>
</ul>
</div>
</div>
<div class="relative bg-yellow-50 p-8 rounded-lg shadow-lg border-l-4 border-yellow-600">
<i class="quote-icon fas fa-quote-right text-yellow-200 bottom-4 right-4"></i>
<div class="relative z-10">
<blockquote class="italic text-xl text-gray-800 leading-relaxed mb-6">
"The Self is ever unborn, for birthlessness is its nature. If it were born, it would be subject to destruction."
</blockquote>
<p class="text-right text-yellow-700 font-medium">— Māṇḍūkya Kārikā 3.19</p>
<div class="mt-8">
<h4 class="font-bold text-blue-800 mb-3">Implications</h4>
<p class="text-gray-700">
This doctrine goes beyond later Advaita formulations that accept Māyā as a provisional explanation. Ajātivāda asserts that nothing has ever happened, is happening, or will happen in absolute reality.
</p>
</div>
</div>
</div>
</div>
<div class="bg-white rounded-lg shadow-lg overflow-hidden">
<div class="grid md:grid-cols-3 divide-y md:divide-y-0 md:divide-x divide-gray-200">
<div class="p-6">
<div class="text-yellow-600 mb-3">
<i class="fas fa-project-diagram text-3xl"></i>
</div>
<h3 class="text-lg font-bold text-blue-800 mb-2">No Causation</h3>
<p class="text-gray-600">
Gaudapāda completely rejects the notion of cause and effect, seeing it as a fundamental error.
</p>
</div>
<div class="p-6">
<div class="text-yellow-600 mb-3">
<i class="fas fa-cloud text-3xl"></i>
</div>
<h3 class="text-lg font-bold text-blue-800 mb-2">Dream Analogy</h3>
<p class="text-gray-600">
The world is likened to a dream - seemingly real while experienced, but recognized as unreal upon awakening.
</p>
</div>
<div class="p-6">
<div class="text-yellow-600 mb-3">
<i class="fas fa-chess text-3xl"></i>
</div>
<h3 class="text-lg font-bold text-blue-800 mb-2">No Player</h3>
<p class="text-gray-600">
There is no individual "player" in the game of existence - only the appearance of one.
</p>
</div>
</div>
</div>
</section>
<!-- Extremism Section -->
<section id="extremism" class="mb-20 fade-in">
<div class="flex items-center mb-8">
<div class="h-px bg-yellow-600 flex-1"></div>
<h2 class="text-3xl font-serif font-bold mx-4 text-center text-blue-900">Radical Non-Dualism</h2>
<div class="h-px bg-yellow-600 flex-1"></div>
</div>
<div class="grid md:grid-cols-2 gap-8">
<div>
<div class="bg-white p-8 rounded-lg shadow-lg mb-6">
<h3 class="text-2xl font-serif font-bold text-blue-800 mb-6">Gaudapāda's Extreme Positions</h3>
<div class="space-y-6">
<div class="flex">
<div class="flex-shrink-0 mt-1">
<div class="h-8 w-8 rounded-full bg-red-100 flex items-center justify-center">
<i class="fas fa-times text-red-600"></i>
</div>
</div>
<div class="ml-4">
<h4 class="text-lg font-bold text-gray-800">Rejection of all dualistic frameworks</h4>
<p class="text-gray-600 mt-1">Even the distinction between illusion and reality is dissolved</p>
</div>
</div>
<div class="flex">
<div class="flex-shrink-0 mt-1">
<div class="h-8 w-8 rounded-full bg-red-100 flex items-center justify-center">
<i class="fas fa-times text-red-600"></i>
</div>
</div>
<div class="ml-4">
<h4 class="text-lg font-bold text-gray-800">No path to realization</h4>
<p class="text-gray-600 mt-1">There is no seeker, no practice, no goal</p>
</div>
</div>
<div class="flex">
<div class="flex-shrink-0 mt-1">
<div class="h-8 w-8 rounded-full bg-red-100 flex items-center justify-center">
<i class="fas fa-times text-red-600"></i>
</div>
</div>
<div class="ml-4">
<h4 class="text-lg font-bold text-gray-800">Denial of Māyā's power</h4>
<p class="text-gray-600 mt-1">Māyā itself cannot exist independently of Brahman</p>
</div>
</div>
<div class="flex">
<div class="flex-shrink-0 mt-1">
<div class="h-8 w-8 rounded-full bg-red-100 flex items-center justify-center">
<i class="fas fa-times text-red-600"></i>
</div>
</div>
<div class="ml-4">
<h4 class="text-lg font-bold text-gray-800">No enlightenment</h4>
<p class="text-gray-600 mt-1">There is nothing to attain or achieve</p>
</div>
</div>
</div>
</div>
<div class="bg-red-50 p-6 rounded-lg border-l-4 border-red-500">
<div class="flex">
<div class="flex-shrink-0">
<i class="fas fa-exclamation-triangle text-red-500 mt-1"></i>
</div>
<div class="ml-3">
<h4 class="font-bold text-red-800">Warning to Seekers</h4>
<p class="text-sm text-red-700">
This absolute non-dualism makes all spiritual practices ultimately meaningless, as they presuppose a separate "doer." Gaudapāda's teaching is only for those ready to abandon all conceptual frameworks.
</p>
</div>
</div>
</div>
</div>
<div>
<div class="relative bg-blue-900 text-white p-8 rounded-lg shadow-lg h-full">
<i class="quote-icon fas fa-star-of-david top-4 right-4 text-blue-700"></i>
<div class="relative z-10">
<h3 class="text-xl font-bold mb-4">The Firebrand Analogy</h3>
<p class="mb-4 leading-relaxed">
Gaudapāda uses the analogy of a whirling firebrand (<span class="sanskrit">अलात</span> alāta) that appears to create a circle of fire. Just as the circle doesn't truly exist apart from the firebrand, the world doesn't exist apart from Consciousness.
</p>
<div class="bg-blue-800 p-4 rounded">
<p class="italic">
"When the firebrand is in motion, the appearance of a circle is produced. This circle is neither existent nor non-existent."
</p>
<p class="text-right text-blue-200 mt-2">— Māṇḍūkya Kārikā 4.47</p>
</div>
</div>
</div>
</div>
</div>
<div class="mt-12 bg-white p-8 rounded-lg shadow-lg">
<h3 class="text-2xl font-serif font-bold text-center text-blue-900 mb-8">Traditional vs. Radical Advaita</h3>
<div class="grid md:grid-cols-2 gap-8">
<div>
<h4 class="text-lg font-bold text-blue-800 mb-4 text-center">Traditional View</h4>
<ul class="space-y-3">
<li class="flex items-start">
<div class="flex-shrink-0 mt-1">
<div class="h-5 w-5 rounded-full bg-blue-100 flex items-center justify-center">
<i class="fas fa-check text-blue-600 text-xs"></i>
</div>
</div>
<p class="ml-3 text-gray-700">Māyā explains apparent reality</p>
</li>
<li class="flex items-start">
<div class="flex-shrink-0 mt-1">
<div class="h-5 w-5 rounded-full bg-blue-100 flex items-center justify-center">
<i class="fas fa-check text-blue-600 text-xs"></i>
</div>
</div>
<p class="ml-3 text-gray-700">Spiritual practice is necessary</p>
</li>
<li class="flex items-start">
<div class="flex-shrink-0 mt-1">
<div class="h-5 w-5 rounded-full bg-blue-100 flex items-center justify-center">
<i class="fas fa-check text-blue-600 text-xs"></i>
</div>
</div>
<p class="ml-3 text-gray-700">Gradual realization possible</p>
</li>
</ul>
</div>
<div>
<h4 class="text-lg font-bold text-red-800 mb-4 text-center">Gaudapāda's View</h4>
<ul class="space-y-3">
<li class="flex items-start">
<div class="flex-shrink-0 mt-1">
<div class="h-5 w-5 rounded-full bg-red-100 flex items-center justify-center">
<i class="fas fa-times text-red-600 text-xs"></i>
</div>
</div>
<p class="ml-3 text-gray-700">Māyā itself is an illusion</p>
</li>
<li class="flex items-start">
<div class="flex-shrink-0 mt-1">
<div class="h-5 w-5 rounded-full bg-red-100 flex items-center justify-center">
<i class="fas fa-times text-red-600 text-xs"></i>
</div>
</div>
<p class="ml-3 text-gray-700">No practice or practitioner</p>
</li>
<li class="flex items-start">
<div class="flex-shrink-0 mt-1">
<div class="h-5 w-5 rounded-full bg-red-100 flex items-center justify-center">
<i class="fas fa-times text-red-600 text-xs"></i>
</div>
</div>
<p class="ml-3 text-gray-700">Nothing ever happened</p>
</li>
</ul>
</div>
</div>
</div>
</section>
<!-- Influence Section -->
<section id="influence" class="mb-20 fade-in">
<div class="flex items-center mb-8">
<div class="h-px bg-yellow-600 flex-1"></div>
<h2 class="text-3xl font-serif font-bold mx-4 text-center text-blue-900">Influence and Legacy</h2>
<div class="h-px bg-yellow-600 flex-1"></div>
</div>
<div class="grid md:grid-cols-2 gap-8 mb-12">
<div>
<p class="text-lg mb-6 text-gray-700 leading-relaxed">
Gaudapāda's radical non-dualism profoundly influenced subsequent Indian philosophy, though his most extreme positions were often tempered by later thinkers to make them more accessible to spiritual practitioners.
</p>
<div class="bg-white p-6 rounded-lg shadow-md mb-6">
<h3 class="text-xl font-semibold text-blue-800 mb-4">Key Figures Influenced</h3>
<div class="space-y-4">
<div class="flex">
<div class="flex-shrink-0 mr-4">
<div class="flex items-center justify-center h-10 w-10 rounded-full bg-purple-100 text-purple-800">
<i class="fas fa-user-alt"></i>
</div>
</div>
<div>
<h4 class="font-medium text-gray-800">Ādi Śaṅkarācārya</h4>
<p class="text-sm text-gray-600">Built upon Gaudapāda's foundation but accepted Māyā provisionally</p>
</div>
</div>
<div class="flex">
<div class="flex-shrink-0 mr-4">
<div class="flex items-center justify-center h-10 w-10 rounded-full bg-green-100 text-green-800">
<i class="fas fa-mountain"></i>
</div>
</div>
<div>
<h4 class="font-medium text-gray-800">Kashmir Śaivism</h4>
<p class="text-sm text-gray-600">Adopted his non-dual framework while emphasizing divine play</p>
</div>
</div>
<div class="flex">
<div class="flex-shrink-0 mr-4">
<div class="flex items-center justify-center h-10 w-10 rounded-full bg-yellow-100 text-yellow-800">
<i class="fas fa-star"></i>
</div>
</div>
<div>
<h4 class="font-medium text-gray-800">Nisargadatta Maharaj</h4>
<p class="text-sm text-gray-600">Modern teacher echoing Gaudapāda's radical non-dualism</p>
</div>
</div>
</div>
</div>
</div>
<div class="relative bg-purple-900 text-white p-8 rounded-lg shadow-lg">
<i class="quote-icon fas fa-quote-left text-purple-700 top-4 left-4"></i>
<div class="relative z-10">
<blockquote class="italic text-xl leading-relaxed mb-6">
"Recognize that all duality is a mere mental projection. There is no coming and going, no bondage, no liberation."
</blockquote>
<p class="text-right text-purple-300 font-medium">— Māṇḍūkya Kārikā 2.32</p>
<div class="mt-8">
<h4 class="font-bold text-yellow-300 mb-3">Contemporary Relevance</h4>
<p class="text-purple-100">
His uncompromising stance continues to challenge seekers to question the very foundation of their perceived reality, influencing modern direct-path approaches to self-realization.
</p>
</div>
</div>
</div>
</div>
<div class="bg-white p-8 rounded-lg shadow-lg">
<h3 class="text-2xl font-serif font-bold text-center text-blue-900 mb-8">Gaudapāda's Philosophical Tree</h3>
<div class="flex justify-center">
<div class="relative">
<!-- Tree visualization -->
<div class="flex flex-col items-center">
<!-- Root -->
<div class="h-4 w-4 rounded-full bg-yellow-600 mb-2"></div>
<!-- Trunk -->
<div class="w-1 h-16 bg-yellow-800"></div>
<!-- Branches -->
<div class="flex space-x-16 -mt-2">
<div class="relative">
<div class="w-12 h-1 bg-yellow-800 transform rotate-30 origin-left"></div>
<div class="absolute -left-2 top-4 w-24 h-8 bg-green-100 rounded-full flex items-center justify-center text-xs font-medium text-green-800 shadow">Śaṅkara</div>
</div>
<div class="relative">
<div class="w-12 h-1 bg-yellow-800 transform -rotate-30 origin-right"></div>
<div class="absolute -right-2 top-4 w-24 h-8 bg-green-100 rounded-full flex items-center justify-center text-xs font-medium text-green-800 shadow">Kashmir Śaiva</div>
</div>
</div>
<!-- More branches -->
<div class="flex space-x-32 -mt-2">
<div class="relative">
<div class="w-8 h-1 bg-yellow-800 transform rotate-15 origin-left"></div>
<div class="absolute -left-4 top-4 w-20 h-8 bg-blue-100 rounded-full flex items-center justify-center text-xs font-medium text-blue-800 shadow">Vedānta</div>
</div>
<div class="relative">
<div class="w-8 h-1 bg-yellow-800 transform -rotate-15 origin-right"></div>
<div class="absolute -right-4 top-4 w-20 h-8 bg-blue-100 rounded-full flex items-center justify-center text-xs font-medium text-blue-800 shadow">Yogācāra</div>
</div>
</div>
<!-- Ground -->
<div class="w-32 h-2 bg-yellow-700 rounded-full mt-4"></div>
<!-- Label -->
<div class="absolute -bottom-8 left-1/2 transform -translate-x-1/2 bg-yellow-600 text-white px-3 py-1 rounded-full text-sm font-bold">
Gaudapāda
</div>
</div>
</div>
</div>
</div>
</section>
</main>
<!-- Footer -->
<footer class="bg-blue-900 text-white py-12">
<div class="container mx-auto px-6">
<div class="grid md:grid-cols-3 gap-8">
<div>
<h3 class="text-xl font-serif font-bold mb-4 text-yellow-300">Gaudapāda Archive</h3>
<p class="text-blue-200">
Dedicated to preserving the most radical expression of non-dual truth, free from compromise or concession.
</p>
</div>
<div>
<h3 class="text-xl font-serif font-bold mb-4 text-yellow-300">Explore More</h3>
<ul class="space-y-2">
<li><a href="#" class="text-blue-200 hover:text-white transition-colors">Full Text of Māṇḍūkya Kārikā</a></li>
<li><a href="#" class="text-blue-200 hover:text-white transition-colors">Comparative Studies</a></li>
<li><a href="#" class="text-blue-200 hover:text-white transition-colors">Modern Interpretations</a></li>
</ul>
</div>
<div>
<h3 class="text-xl font-serif font-bold mb-4 text-yellow-300">Subscribe</h3>
<p class="text-blue-200 mb-4">Receive updates on Gaudapāda studies</p>
<div class="flex">
<input type="email" placeholder="Your email" class="px-4 py-2 rounded-l focus:outline-none text-gray-800 w-full">
<button class="bg-yellow-600 hover:bg-yellow-700 px-4 py-2 rounded-r text-white font-medium">
<i class="fas fa-paper-plane"></i>
</button>
</div>
</div>
</div>
<div class="border-t border-blue-800 mt-8 pt-8 text-center text-blue-300">
<p>&copy; 2023 Gaudapāda Advaita Archive | <span class="italic">All Duality is Illusion</span></p>
<div class="mt-4 flex justify-center space-x-4">
<a href="#top" class="text-yellow-300 hover:text-white transition-colors">
<i class="fas fa-arrow-up"></i> Back to Top
</a>
<a href="#" class="text-yellow-300 hover:text-white transition-colors">
<i class="fas fa-share-alt"></i> Share
</a>
</div>
</div>
</div>
</footer>
<!-- Back to top button -->
<button id="back-to-top" class="fixed bottom-8 right-8 bg-blue-800 text-white p-3 rounded-full shadow-lg opacity-0 invisible transition-all duration-300 hover:bg-blue-700">
<i class="fas fa-arrow-up"></i>
</button>
<script>
// Back to top button
const backToTopButton = document.getElementById('back-to-top');
window.addEventListener('scroll', () => {
if (window.pageYOffset > 300) {
backToTopButton.classList.remove('opacity-0', 'invisible');
backToTopButton.classList.add('opacity-100', 'visible');
} else {
backToTopButton.classList.remove('opacity-100', 'visible');
backToTopButton.classList.add('opacity-0', 'invisible');
}
});
backToTopButton.addEventListener('click', () => {
window.scrollTo({ top: 0, behavior: 'smooth' });
});
// Smooth scrolling for navigation links
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
anchor.addEventListener('click', function(e) {
e.preventDefault();
const targetId = this.getAttribute('href');
if (targetId === '#') return;
const targetElement = document.querySelector(targetId);
if (targetElement) {
window.scrollTo({
top: targetElement.offsetTop - 80,
behavior: 'smooth'
});
}
});
});
// Scroll to section function
function scrollToSection(sectionId) {
const section = document.getElementById(sectionId);
if (section) {
window.scrollTo({
top: section.offsetTop - 80,
behavior: 'smooth'
});
}
}
// Toggle dark mode
function toggleDarkMode() {
document.body.classList.toggle('bg-gray-900');
document.body.classList.toggle('text-gray-100');
// You would need to add more classes to toggle for a complete dark mode
// This is a simplified version
}
// Play audio function
function playAudio(id) {
const audio = document.getElementById(`${id}-audio`);
if (audio) {
audio.play();
}
}
// Intersection Observer for fade-in animations
const observerOptions = {
threshold: 0.1
};
const observer = new IntersectionObserver((entries) => {
entries.forEach(entry => {
if (entry.isIntersecting) {
entry.target.classList.add('fade-in');
observer.unobserve(entry.target);
}
});
}, observerOptions);
document.querySelectorAll('section').forEach(section => {
observer.observe(section);
});
</script>
<p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=druvx13/radiacal-advaita" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
</html>