Implement dynamic daily verse system with rotating Biblical content

- Add daily-verse API endpoint with 7 rotating verses in Romanian and English
- Replace static homepage verse with dynamic fetch from API
- Ensure consistent daily rotation using day-of-year calculation
- Support both ro and en locales for verse content

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>

app/[locale]/page.tsx

@@ -49,6 +49,33 @@ export default function Home() {
   const [userCount, setUserCount] = useState(2847)
   const [expandedFaq, setExpandedFaq] = useState<string | false>(false)
   const [email, setEmail] = useState('')
+  const [dailyVerse, setDailyVerse] = useState<{
+    date: string
+    verse: string
+    reference: string
+  } | null>(null)
+
+  // Fetch daily verse
+  useEffect(() => {
+    const fetchDailyVerse = async () => {
+      try {
+        const response = await fetch(`/api/daily-verse?locale=${locale}`)
+        if (response.ok) {
+          const result = await response.json()
+          setDailyVerse(result.data)
+        }
+      } catch (error) {
+        console.error('Failed to fetch daily verse:', error)
+        // Fallback to static content if API fails
+        setDailyVerse({
+          date: getCurrentDate(),
+          verse: t('dailyVerse.verse'),
+          reference: t('dailyVerse.reference')
+        })
+      }
+    }
+    fetchDailyVerse()
+  }, [locale, t])
 
   // Simulate live user counter
   useEffect(() => {
@@ -229,15 +256,15 @@ export default function Home() {
             {t('dailyVerse.title')}
           </Typography>
           <Typography variant="body2" textAlign="center" sx={{ mb: 4, opacity: 0.9 }}>
-            {getCurrentDate()}
+            {dailyVerse?.date || getCurrentDate()}
           </Typography>
 
           <Paper sx={{ p: 4, textAlign: 'center', bgcolor: 'rgba(255,255,255,0.95)', color: 'text.primary', borderRadius: 3 }}>
             <Typography variant="h5" sx={{ mb: 3, fontStyle: 'italic', lineHeight: 1.6 }}>
-              {t('dailyVerse.verse')}
+              {dailyVerse?.verse || t('dailyVerse.verse')}
             </Typography>
             <Typography variant="h6" color="primary" sx={{ fontWeight: 600 }}>
-              {t('dailyVerse.reference')}
+              {dailyVerse?.reference || t('dailyVerse.reference')}
             </Typography>
 
             <Box sx={{ display: 'flex', gap: 1, justifyContent: 'center', mt: 3 }}>
@@ -245,8 +272,8 @@ export default function Home() {
                 <IconButton
                   color="primary"
                   onClick={() => {
-                    const verseText = t('dailyVerse.verse')
-                    const reference = t('dailyVerse.reference')
+                    const verseText = dailyVerse?.verse || t('dailyVerse.verse')
+                    const reference = dailyVerse?.reference || t('dailyVerse.reference')
                     const discussMessage = locale === 'ro'
                       ? `Poți să îmi explici mai mult despre acest verset: "${verseText}" (${reference})?`
                       : `Can you explain more about this verse: "${verseText}" (${reference})?`