diff --git a/frontend/rabbi_gerzi/src/views/HomePage.vue b/frontend/rabbi_gerzi/src/views/HomePage.vue
index 8de51e4..cc83690 100644
--- a/frontend/rabbi_gerzi/src/views/HomePage.vue
+++ b/frontend/rabbi_gerzi/src/views/HomePage.vue
@@ -5,6 +5,15 @@ const navItems = [
{ label: 'Contact', href: '/contact', icon: '➤' },
{ label: 'Donate', href: '/donate', icon: '♡' },
]
+
+const coreTeachings = [
+ { number: 1, title: 'Introduction', glyph: '⌂' },
+ { number: 2, title: 'Foundations', glyph: '◧' },
+ { number: 3, title: 'Divine Plan', glyph: '◯' },
+ { number: 4, title: 'Architecture of the Soul', glyph: '♥' },
+ { number: 5, title: 'Arba Yesodot', glyph: '✦' },
+ { number: 6, title: 'Fluid Integration', glyph: '✎' },
+]
@@ -81,6 +90,24 @@ const navItems = [
+
+
+
+
Baderech HaAvodah (Core Teachings)
+
+
+
+ {{ teaching.glyph }}
+
+
{{ teaching.number }}) {{ teaching.title }}
+
+
+
+
@@ -279,6 +306,53 @@ const navItems = [
margin-bottom: 0;
}
+.core-teachings {
+ background: var(--color-white);
+ padding: 5rem 2rem;
+}
+
+.core-teachings__inner {
+ max-width: 1000px;
+ margin: 0 auto;
+}
+
+.core-teachings__heading {
+ font-family: var(--font-serif);
+ font-weight: 400;
+ font-size: clamp(1.5rem, 2.4vw, 2rem);
+ color: var(--color-slate);
+ text-align: center;
+ margin: 0 0 3rem 0;
+}
+
+.core-teachings__grid {
+ display: grid;
+ grid-template-columns: repeat(3, 1fr);
+ gap: 3rem 2rem;
+}
+
+.core-teachings__tile {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ text-align: center;
+}
+
+.core-teachings__glyph {
+ font-size: 3rem;
+ line-height: 1;
+ color: var(--color-slate);
+ margin-bottom: 1rem;
+ font-weight: 300;
+}
+
+.core-teachings__label {
+ font-family: var(--font-serif);
+ font-size: 1rem;
+ color: var(--color-text-muted);
+ margin: 0;
+}
+
@media (max-width: 768px) {
.site-header {
padding: 0.75rem 1rem;
@@ -302,5 +376,16 @@ const navItems = [
.hero__hiker {
width: 60%;
}
+
+ .core-teachings__grid {
+ grid-template-columns: repeat(2, 1fr);
+ gap: 2rem 1rem;
+ }
+}
+
+@media (max-width: 480px) {
+ .core-teachings__grid {
+ grid-template-columns: 1fr;
+ }
}