{"id":116,"date":"2026-10-07T04:49:51","date_gmt":"2026-10-07T04:49:51","guid":{"rendered":"https:\/\/nathanwp.bakj.eu\/?page_id=116"},"modified":"2026-10-07T05:20:03","modified_gmt":"2026-10-07T05:20:03","slug":"creation-story","status":"publish","type":"page","link":"https:\/\/nathanwp.bakj.eu\/?page_id=116","title":{"rendered":"Creation Story"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"116\" class=\"elementor elementor-116\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-d866df1 e-flex e-con-boxed e-con e-parent\" data-id=\"d866df1\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-96397f7 elementor-widget elementor-widget-html\" data-id=\"96397f7\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!-- Genesis 1 Creation Story Book (Thai) -->\r\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Chonburi&display=swap\" rel=\"stylesheet\">\r\n\r\n<style>\r\n  .creation-book-wrapper * {\r\n    box-sizing: border-box;\r\n    margin: 0;\r\n    padding: 0;\r\n    font-family: 'Chonburi', -apple-system, BlinkMacSystemFont, \"Sarabun\", \"Prompt\", \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\r\n  }\r\n\r\n  .creation-book-wrapper {\r\n    width: 100%;\r\n    max-width: 900px;\r\n    margin: 0 auto;\r\n    background: #0d1117;\r\n    color: #f0f6fc;\r\n    border-radius: 16px;\r\n    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.6);\r\n    overflow: hidden;\r\n    position: relative;\r\n    user-select: none;\r\n    border: 1px solid rgba(255, 255, 255, 0.1);\r\n  }\r\n\r\n  .creation-header {\r\n    display: flex;\r\n    justify-content: space-between;\r\n    align-items: center;\r\n    padding: 16px 24px;\r\n    background: rgba(22, 27, 34, 0.8);\r\n    backdrop-filter: blur(10px);\r\n    border-bottom: 1px solid rgba(255, 255, 255, 0.08);\r\n  }\r\n\r\n  .creation-header h2 {\r\n    font-size: 1.25rem;\r\n    font-weight: 400;\r\n    color: #e6edf3;\r\n    letter-spacing: 0.5px;\r\n  }\r\n\r\n  .creation-header-controls {\r\n    display: flex;\r\n    gap: 12px;\r\n    align-items: center;\r\n  }\r\n\r\n  .icon-btn {\r\n    background: rgba(255, 255, 255, 0.05);\r\n    border: 1px solid rgba(255, 255, 255, 0.1);\r\n    color: #c9d1d9;\r\n    padding: 8px 12px;\r\n    border-radius: 8px;\r\n    cursor: pointer;\r\n    font-size: 0.875rem;\r\n    display: flex;\r\n    align-items: center;\r\n    gap: 6px;\r\n    transition: all 0.2s ease;\r\n  }\r\n\r\n  .icon-btn:hover {\r\n    background: rgba(255, 255, 255, 0.15);\r\n    color: #fff;\r\n    border-color: rgba(255, 255, 255, 0.25);\r\n  }\r\n\r\n  .creation-content-container {\r\n    display: flex;\r\n    flex-direction: column;\r\n    min-height: 520px;\r\n    position: relative;\r\n    overflow: hidden;\r\n  }\r\n\r\n  @media (min-width: 768px) {\r\n    .creation-content-container {\r\n      flex-direction: row;\r\n      height: 520px;\r\n    }\r\n  }\r\n\r\n  .creation-visual-pane {\r\n    flex: 1;\r\n    background: #000;\r\n    position: relative;\r\n    display: flex;\r\n    justify-content: center;\r\n    align-items: center;\r\n    min-height: 280px;\r\n    overflow: hidden;\r\n  }\r\n\r\n  .creation-visual-pane svg {\r\n    width: 100%;\r\n    height: 100%;\r\n    max-height: 520px;\r\n    object-fit: cover;\r\n  }\r\n\r\n  .creation-text-pane {\r\n    flex: 1;\r\n    padding: 32px 28px;\r\n    display: flex;\r\n    flex-direction: column;\r\n    justify-content: space-between;\r\n    background: rgba(13, 17, 23, 0.95);\r\n    position: relative;\r\n    z-index: 2;\r\n  }\r\n\r\n  .creation-text-content {\r\n    opacity: 1;\r\n    transform: translateY(0);\r\n    transition: opacity 0.35s ease, transform 0.35s ease;\r\n  }\r\n\r\n  .creation-text-content.changing {\r\n    opacity: 0;\r\n    transform: translateY(12px);\r\n  }\r\n\r\n  .day-badge {\r\n    display: inline-block;\r\n    padding: 4px 12px;\r\n    background: rgba(56, 139, 253, 0.15);\r\n    color: #58a6ff;\r\n    border: 1px solid rgba(56, 139, 253, 0.3);\r\n    border-radius: 20px;\r\n    font-size: 0.85rem;\r\n    margin-bottom: 12px;\r\n  }\r\n\r\n  .day-title {\r\n    font-size: 1.6rem;\r\n    font-weight: 400;\r\n    color: #ffffff;\r\n    margin-bottom: 12px;\r\n    line-height: 1.4;\r\n  }\r\n\r\n  .god-said-box {\r\n    background: rgba(255, 255, 255, 0.03);\r\n    border-left: 3px solid #e3b341;\r\n    padding: 12px 16px;\r\n    margin-bottom: 16px;\r\n    border-radius: 0 8px 8px 0;\r\n  }\r\n\r\n  .god-said-label {\r\n    font-size: 0.75rem;\r\n    letter-spacing: 1px;\r\n    color: #e3b341;\r\n    margin-bottom: 4px;\r\n  }\r\n\r\n  .god-said-text {\r\n    font-size: 0.95rem;\r\n    color: #f0f6fc;\r\n    line-height: 1.6;\r\n  }\r\n\r\n  .day-description {\r\n    font-size: 0.9rem;\r\n    line-height: 1.8;\r\n    color: #8b949e;\r\n    margin-bottom: 16px;\r\n  }\r\n\r\n  .scripture-ref {\r\n    font-size: 0.85rem;\r\n    color: #6e7681;\r\n  }\r\n\r\n  .creation-navigation {\r\n    display: flex;\r\n    justify-content: space-between;\r\n    align-items: center;\r\n    padding: 16px 24px;\r\n    background: rgba(22, 27, 34, 0.9);\r\n    border-top: 1px solid rgba(255, 255, 255, 0.08);\r\n  }\r\n\r\n  .nav-btn {\r\n    background: #238636;\r\n    color: #ffffff;\r\n    border: none;\r\n    padding: 10px 20px;\r\n    border-radius: 8px;\r\n    font-size: 0.9rem;\r\n    cursor: pointer;\r\n    display: flex;\r\n    align-items: center;\r\n    gap: 8px;\r\n    transition: all 0.2s ease;\r\n  }\r\n\r\n  .nav-btn:hover:not(:disabled) {\r\n    background: #2ea043;\r\n    transform: translateY(-1px);\r\n  }\r\n\r\n  .nav-btn:disabled {\r\n    background: rgba(255, 255, 255, 0.05);\r\n    color: #484f58;\r\n    cursor: not-allowed;\r\n  }\r\n\r\n  .page-dots {\r\n    display: flex;\r\n    gap: 8px;\r\n  }\r\n\r\n  .dot {\r\n    width: 10px;\r\n    height: 10px;\r\n    border-radius: 50%;\r\n    background: rgba(255, 255, 255, 0.2);\r\n    cursor: pointer;\r\n    transition: all 0.25s ease;\r\n  }\r\n\r\n  .dot.active {\r\n    background: #58a6ff;\r\n    width: 24px;\r\n    border-radius: 5px;\r\n  }\r\n\r\n  \/* SVG Animations *\/\r\n  @keyframes spinSlow {\r\n    from { transform: rotate(0deg); }\r\n    to { transform: rotate(360deg); }\r\n  }\r\n\r\n  @keyframes pulseLight {\r\n    0%, 100% { opacity: 0.3; transform: scale(0.98); }\r\n    50% { opacity: 0.8; transform: scale(1.02); }\r\n  }\r\n\r\n  @keyframes floatSlow {\r\n    0%, 100% { transform: translateY(0px); }\r\n    50% { transform: translateY(-8px); }\r\n  }\r\n\r\n  @keyframes waveMotion {\r\n    0% { transform: translateX(0); }\r\n    50% { transform: translateX(-25px); }\r\n    100% { transform: translateX(0); }\r\n  }\r\n\r\n  .anim-spin { animation: spinSlow 40s linear infinite; transform-origin: center; }\r\n  .anim-pulse { animation: pulseLight 4s ease-in-out infinite; transform-origin: center; }\r\n  .anim-float { animation: floatSlow 5s ease-in-out infinite; }\r\n  .anim-wave { animation: waveMotion 8s ease-in-out infinite; }\r\n<\/style>\r\n\r\n<div class=\"creation-book-wrapper\" id=\"creationBook\">\r\n  <div class=\"creation-header\">\r\n    <h2>\u0e2b\u0e19\u0e31\u0e07\u0e2a\u0e37\u0e2d\u0e1b\u0e23\u0e30\u0e27\u0e31\u0e15\u0e34\u0e01\u0e32\u0e23\u0e17\u0e23\u0e07\u0e2a\u0e23\u0e49\u0e32\u0e07 (\u0e1b\u0e10\u0e21\u0e01\u0e32\u0e25 1)<\/h2>\r\n    <div class=\"creation-header-controls\">\r\n      <button class=\"icon-btn\" id=\"audioToggleBtn\" title=\"\u0e40\u0e1b\u0e34\u0e14\/\u0e1b\u0e34\u0e14 \u0e40\u0e2a\u0e35\u0e22\u0e07\u0e1b\u0e23\u0e30\u0e01\u0e2d\u0e1a\">\r\n        <span id=\"audioIcon\">\ud83d\udd0a<\/span> <span id=\"audioText\">\u0e40\u0e2a\u0e35\u0e22\u0e07<\/span>\r\n      <\/button>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <div class=\"creation-content-container\">\r\n    <div class=\"creation-visual-pane\" id=\"visualPane\">\r\n      <!-- Dynamic SVG Art Rendered Here -->\r\n    <\/div>\r\n    <div class=\"creation-text-pane\">\r\n      <div class=\"creation-text-content\" id=\"textContent\">\r\n        <span class=\"day-badge\" id=\"dayBadge\">\u0e2b\u0e19\u0e49\u0e32 1 \u0e08\u0e32\u0e01 8<\/span>\r\n        <h3 class=\"day-title\" id=\"dayTitle\">\u0e43\u0e19\u0e1b\u0e10\u0e21\u0e01\u0e32\u0e25<\/h3>\r\n        \r\n        <div class=\"god-said-box\" id=\"godSaidContainer\">\r\n          <div class=\"god-said-label\">\u0e1e\u0e23\u0e30\u0e40\u0e08\u0e49\u0e32\u0e15\u0e23\u0e31\u0e2a\u0e27\u0e48\u0e32<\/div>\r\n          <div class=\"god-said-text\" id=\"godSaidText\">\"\u0e08\u0e07\u0e21\u0e35\u0e04\u0e27\u0e32\u0e21\u0e2a\u0e27\u0e48\u0e32\u0e07\"<\/div>\r\n        <\/div>\r\n\r\n        <p class=\"day-description\" id=\"dayDesc\">\r\n          \u0e43\u0e19\u0e1b\u0e10\u0e21\u0e01\u0e32\u0e25 \u0e1e\u0e23\u0e30\u0e40\u0e08\u0e49\u0e32\u0e17\u0e23\u0e07\u0e40\u0e19\u0e23\u0e21\u0e34\u0e15\u0e2a\u0e23\u0e49\u0e32\u0e07\u0e1f\u0e49\u0e32\u0e41\u0e25\u0e30\u0e41\u0e1c\u0e48\u0e19\u0e14\u0e34\u0e19 \u0e41\u0e1c\u0e48\u0e19\u0e14\u0e34\u0e19\u0e01\u0e47\u0e27\u0e48\u0e32\u0e07\u0e40\u0e1b\u0e25\u0e48\u0e32\u0e41\u0e25\u0e30\u0e21\u0e35\u0e04\u0e27\u0e32\u0e21\u0e21\u0e37\u0e14\u0e2d\u0e22\u0e39\u0e48\u0e40\u0e2b\u0e19\u0e37\u0e2d\u0e2b\u0e49\u0e27\u0e07\u0e19\u0e49\u0e33\r\n        <\/p>\r\n\r\n        <div class=\"scripture-ref\" id=\"scriptureRef\">\u0e1b\u0e10\u0e21\u0e01\u0e32\u0e25 1:1-2<\/div>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <div class=\"creation-navigation\">\r\n    <button class=\"nav-btn\" id=\"prevBtn\" disabled>\r\n      \u2190 \u0e22\u0e49\u0e2d\u0e19\u0e01\u0e25\u0e31\u0e1a\r\n    <\/button>\r\n\r\n    <div class=\"page-dots\" id=\"pageDots\"><\/div>\r\n\r\n    <button class=\"nav-btn\" id=\"nextBtn\">\r\n      \u0e16\u0e31\u0e14\u0e44\u0e1b \u2192\r\n    <\/button>\r\n  <\/div>\r\n<\/div>\r\n\r\n<script>\r\n  (function() {\r\n    const creationData = [\r\n      {\r\n        badge: \"\u0e01\u0e32\u0e23\u0e40\u0e23\u0e34\u0e48\u0e21\u0e15\u0e49\u0e19\",\r\n        title: \"\u0e43\u0e19\u0e1b\u0e10\u0e21\u0e01\u0e32\u0e25\",\r\n        godSaid: null,\r\n        desc: \"\u0e43\u0e19\u0e1b\u0e10\u0e21\u0e01\u0e32\u0e25 \u0e1e\u0e23\u0e30\u0e40\u0e08\u0e49\u0e32\u0e17\u0e23\u0e07\u0e40\u0e19\u0e23\u0e21\u0e34\u0e15\u0e2a\u0e23\u0e49\u0e32\u0e07\u0e1f\u0e49\u0e32\u0e41\u0e25\u0e30\u0e41\u0e1c\u0e48\u0e19\u0e14\u0e34\u0e19 \u0e41\u0e1c\u0e48\u0e19\u0e14\u0e34\u0e19\u0e01\u0e47\u0e27\u0e48\u0e32\u0e07\u0e40\u0e1b\u0e25\u0e48\u0e32\u0e41\u0e25\u0e30\u0e21\u0e35\u0e04\u0e27\u0e32\u0e21\u0e21\u0e37\u0e14\u0e2d\u0e22\u0e39\u0e48\u0e40\u0e2b\u0e19\u0e37\u0e2d\u0e2b\u0e49\u0e27\u0e07\u0e19\u0e49\u0e33 \u0e41\u0e25\u0e30\u0e1e\u0e23\u0e30\u0e27\u0e34\u0e0d\u0e0d\u0e32\u0e13\u0e02\u0e2d\u0e07\u0e1e\u0e23\u0e30\u0e40\u0e08\u0e49\u0e32\u0e40\u0e04\u0e25\u0e37\u0e48\u0e2d\u0e19\u0e44\u0e2b\u0e27\u0e2d\u0e22\u0e39\u0e48\u0e40\u0e2b\u0e19\u0e37\u0e2d\u0e19\u0e49\u0e33\u0e19\u0e31\u0e49\u0e19\",\r\n        ref: \"\u0e1b\u0e10\u0e21\u0e01\u0e32\u0e25 1:1-2\",\r\n        svg: `<svg viewBox=\"0 0 500 500\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\r\n          <rect width=\"500\" height=\"500\" fill=\"#030712\"\/>\r\n          <circle cx=\"250\" cy=\"250\" r=\"180\" fill=\"url(#voidGrad)\" class=\"anim-pulse\" opacity=\"0.6\"\/>\r\n          <path d=\"M 0 380 Q 125 340 250 380 T 500 380 L 500 500 L 0 500 Z\" fill=\"#0b132b\" opacity=\"0.7\" class=\"anim-wave\"\/>\r\n          <path d=\"M 0 410 Q 125 450 250 410 T 500 410 L 500 500 L 0 500 Z\" fill=\"#1c2541\" opacity=\"0.5\"\/>\r\n          <defs>\r\n            <radialGradient id=\"voidGrad\" cx=\"50%\" cy=\"50%\" r=\"50%\">\r\n              <stop offset=\"0%\" stop-color=\"#1e1b4b\" stop-opacity=\"0.8\"\/>\r\n              <stop offset=\"100%\" stop-color=\"#030712\" stop-opacity=\"0\"\/>\r\n            <\/radialGradient>\r\n          <\/defs>\r\n        <\/svg>`\r\n      },\r\n      {\r\n        badge: \"\u0e27\u0e31\u0e19\u0e17\u0e35\u0e48 1\",\r\n        title: \"\u0e04\u0e27\u0e32\u0e21\u0e2a\u0e27\u0e48\u0e32\u0e07\u0e41\u0e25\u0e30\u0e04\u0e27\u0e32\u0e21\u0e21\u0e37\u0e14\",\r\n        godSaid: \"\u201c\u0e08\u0e07\u0e21\u0e35\u0e04\u0e27\u0e32\u0e21\u0e2a\u0e27\u0e48\u0e32\u0e07\u201d\",\r\n        desc: \"\u0e41\u0e25\u0e49\u0e27\u0e04\u0e27\u0e32\u0e21\u0e2a\u0e27\u0e48\u0e32\u0e07\u0e01\u0e47\u0e40\u0e01\u0e34\u0e14\u0e02\u0e36\u0e49\u0e19 \u0e1e\u0e23\u0e30\u0e40\u0e08\u0e49\u0e32\u0e17\u0e23\u0e07\u0e40\u0e2b\u0e47\u0e19\u0e27\u0e48\u0e32\u0e04\u0e27\u0e32\u0e21\u0e2a\u0e27\u0e48\u0e32\u0e07\u0e19\u0e31\u0e49\u0e19\u0e14\u0e35 \u0e41\u0e25\u0e30\u0e17\u0e23\u0e07\u0e41\u0e22\u0e01\u0e04\u0e27\u0e32\u0e21\u0e2a\u0e27\u0e48\u0e32\u0e07\u0e2d\u0e2d\u0e01\u0e08\u0e32\u0e01\u0e04\u0e27\u0e32\u0e21\u0e21\u0e37\u0e14 \u0e1e\u0e23\u0e30\u0e40\u0e08\u0e49\u0e32\u0e17\u0e23\u0e07\u0e40\u0e23\u0e35\u0e22\u0e01\u0e04\u0e27\u0e32\u0e21\u0e2a\u0e27\u0e48\u0e32\u0e07\u0e19\u0e31\u0e49\u0e19\u0e27\u0e48\u0e32 \u0e27\u0e31\u0e19 \u0e41\u0e25\u0e30\u0e17\u0e23\u0e07\u0e40\u0e23\u0e35\u0e22\u0e01\u0e04\u0e27\u0e32\u0e21\u0e21\u0e37\u0e14\u0e19\u0e31\u0e49\u0e19\u0e27\u0e48\u0e32 \u0e04\u0e37\u0e19\",\r\n        ref: \"\u0e1b\u0e10\u0e21\u0e01\u0e32\u0e25 1:3-5\",\r\n        svg: `<svg viewBox=\"0 0 500 500\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\r\n          <rect width=\"500\" height=\"500\" fill=\"#090d16\"\/>\r\n          <polygon points=\"250,0 500,0 500,500 250,500\" fill=\"#fef08a\" opacity=\"0.15\"\/>\r\n          <circle cx=\"250\" cy=\"250\" r=\"140\" fill=\"url(#sunLight)\" class=\"anim-pulse\"\/>\r\n          <path d=\"M 0 0 L 250 0 L 250 500 L 0 500 Z\" fill=\"#030712\" opacity=\"0.85\"\/>\r\n          <line x1=\"250\" y1=\"0\" x2=\"250\" y2=\"500\" stroke=\"#fef08a\" stroke-width=\"3\" opacity=\"0.8\"\/>\r\n          <defs>\r\n            <radialGradient id=\"sunLight\" cx=\"50%\" cy=\"50%\" r=\"50%\">\r\n              <stop offset=\"0%\" stop-color=\"#ffffff\"\/>\r\n              <stop offset=\"40%\" stop-color=\"#fef08a\"\/>\r\n              <stop offset=\"100%\" stop-color=\"#f59e0b\" stop-opacity=\"0\"\/>\r\n            <\/radialGradient>\r\n          <\/defs>\r\n        <\/svg>`\r\n      },\r\n      {\r\n        badge: \"\u0e27\u0e31\u0e19\u0e17\u0e35\u0e48 2\",\r\n        title: \"\u0e01\u0e32\u0e23\u0e02\u0e22\u0e32\u0e22\u0e2a\u0e48\u0e27\u0e19\u0e20\u0e32\u0e04\u0e1e\u0e37\u0e49\u0e19\u0e1f\u0e49\u0e32\",\r\n        godSaid: \"\u201c\u0e08\u0e07\u0e21\u0e35\u0e41\u0e1c\u0e48\u0e19\u0e1f\u0e49\u0e32\u0e43\u0e19\u0e23\u0e30\u0e2b\u0e27\u0e48\u0e32\u0e07\u0e19\u0e49\u0e33 \u0e41\u0e22\u0e01\u0e19\u0e49\u0e33\u0e2d\u0e2d\u0e01\u0e08\u0e32\u0e01\u0e01\u0e31\u0e19\u201d\",\r\n        desc: \"\u0e1e\u0e23\u0e30\u0e40\u0e08\u0e49\u0e32\u0e17\u0e23\u0e07\u0e2a\u0e23\u0e49\u0e32\u0e07\u0e41\u0e1c\u0e48\u0e19\u0e1f\u0e49\u0e32 \u0e41\u0e25\u0e30\u0e17\u0e23\u0e07\u0e41\u0e22\u0e01\u0e19\u0e49\u0e33\u0e17\u0e35\u0e48\u0e2d\u0e22\u0e39\u0e48\u0e43\u0e15\u0e49\u0e41\u0e1c\u0e48\u0e19\u0e1f\u0e49\u0e32\u0e2d\u0e2d\u0e01\u0e08\u0e32\u0e01\u0e19\u0e49\u0e33\u0e17\u0e35\u0e48\u0e2d\u0e22\u0e39\u0e48\u0e40\u0e2b\u0e19\u0e37\u0e2d\u0e41\u0e1c\u0e48\u0e19\u0e1f\u0e49\u0e32 \u0e01\u0e47\u0e40\u0e1b\u0e47\u0e19\u0e14\u0e31\u0e07\u0e19\u0e31\u0e49\u0e19 \u0e1e\u0e23\u0e30\u0e40\u0e08\u0e49\u0e32\u0e17\u0e23\u0e07\u0e40\u0e23\u0e35\u0e22\u0e01\u0e41\u0e1c\u0e48\u0e19\u0e1f\u0e49\u0e32\u0e19\u0e31\u0e49\u0e19\u0e27\u0e48\u0e32 \u0e1f\u0e49\u0e32\",\r\n        ref: \"\u0e1b\u0e10\u0e21\u0e01\u0e32\u0e25 1:6-8\",\r\n        svg: `<svg viewBox=\"0 0 500 500\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\r\n          <rect width=\"500\" height=\"500\" fill=\"#0284c7\"\/>\r\n          <rect width=\"500\" height=\"500\" fill=\"url(#skyGrad)\"\/>\r\n          <g opacity=\"0.4\" class=\"anim-float\">\r\n            <ellipse cx=\"150\" cy=\"100\" rx=\"120\" ry=\"40\" fill=\"#ffffff\"\/>\r\n            <ellipse cx=\"350\" cy=\"80\" rx=\"140\" ry=\"45\" fill=\"#ffffff\"\/>\r\n          <\/g>\r\n          <rect x=\"0\" y=\"220\" width=\"500\" height=\"60\" fill=\"#38bdf8\" opacity=\"0.3\" class=\"anim-pulse\"\/>\r\n          <line x1=\"0\" y1=\"250\" x2=\"500\" y2=\"250\" stroke=\"#ffffff\" stroke-width=\"2\" opacity=\"0.6\"\/>\r\n          <path d=\"M 0 360 Q 125 330 250 360 T 500 360 L 500 500 L 0 500 Z\" fill=\"#0369a1\" class=\"anim-wave\"\/>\r\n          <path d=\"M 0 400 Q 125 430 250 400 T 500 400 L 500 500 L 0 500 Z\" fill=\"#0c4a6e\" opacity=\"0.8\"\/>\r\n          <defs>\r\n            <linearGradient id=\"skyGrad\" x1=\"0%\" y1=\"0%\" x2=\"0%\" y2=\"100%\">\r\n              <stop offset=\"0%\" stop-color=\"#075985\"\/>\r\n              <stop offset=\"50%\" stop-color=\"#38bdf8\"\/>\r\n              <stop offset=\"100%\" stop-color=\"#0284c7\"\/>\r\n            <\/linearGradient>\r\n          <\/defs>\r\n        <\/svg>`\r\n      },\r\n      {\r\n        badge: \"\u0e27\u0e31\u0e19\u0e17\u0e35\u0e48 3\",\r\n        title: \"\u0e41\u0e1c\u0e48\u0e19\u0e14\u0e34\u0e19\u0e41\u0e2b\u0e49\u0e07\u0e41\u0e25\u0e30\u0e1e\u0e37\u0e0a\u0e1e\u0e23\u0e23\u0e13\",\r\n        godSaid: \"\u201c\u0e19\u0e49\u0e33\u0e17\u0e35\u0e48\u0e2d\u0e22\u0e39\u0e48\u0e43\u0e15\u0e49\u0e1f\u0e49\u0e32\u0e08\u0e07\u0e23\u0e27\u0e21\u0e2d\u0e22\u0e39\u0e48\u0e43\u0e19\u0e17\u0e35\u0e48\u0e40\u0e14\u0e35\u0e22\u0e27\u0e01\u0e31\u0e19 \u0e41\u0e25\u0e30\u0e43\u0e2b\u0e49\u0e41\u0e1c\u0e48\u0e19\u0e14\u0e34\u0e19\u0e41\u0e2b\u0e49\u0e07\u0e1b\u0e23\u0e32\u0e01\u0e0f\u0e02\u0e36\u0e49\u0e19\u201d\",\r\n        desc: \"\u0e1e\u0e23\u0e30\u0e40\u0e08\u0e49\u0e32\u0e17\u0e23\u0e07\u0e40\u0e23\u0e35\u0e22\u0e01\u0e41\u0e1c\u0e48\u0e19\u0e14\u0e34\u0e19\u0e41\u0e2b\u0e49\u0e07\u0e19\u0e31\u0e49\u0e19\u0e27\u0e48\u0e32 \u0e41\u0e1c\u0e48\u0e19\u0e14\u0e34\u0e19 \u0e41\u0e25\u0e30\u0e17\u0e35\u0e48\u0e0b\u0e36\u0e48\u0e07\u0e19\u0e49\u0e33\u0e23\u0e27\u0e21\u0e01\u0e31\u0e19\u0e19\u0e31\u0e49\u0e19\u0e27\u0e48\u0e32 \u0e17\u0e30\u0e40\u0e25 \u0e41\u0e25\u0e49\u0e27\u0e1e\u0e23\u0e30\u0e40\u0e08\u0e49\u0e32\u0e15\u0e23\u0e31\u0e2a\u0e27\u0e48\u0e32 \u201c\u0e43\u0e2b\u0e49\u0e41\u0e1c\u0e48\u0e19\u0e14\u0e34\u0e19\u0e40\u0e01\u0e34\u0e14\u0e1e\u0e37\u0e0a\u0e1e\u0e23\u0e23\u0e13\u201d \u0e41\u0e1c\u0e48\u0e19\u0e14\u0e34\u0e19\u0e01\u0e47\u0e40\u0e01\u0e34\u0e14\u0e2b\u0e0d\u0e49\u0e32 \u0e41\u0e25\u0e30\u0e1e\u0e37\u0e0a\u0e17\u0e35\u0e48\u0e21\u0e35\u0e40\u0e21\u0e25\u0e47\u0e14 \u0e41\u0e25\u0e30\u0e15\u0e49\u0e19\u0e44\u0e21\u0e49\u0e17\u0e35\u0e48\u0e2d\u0e2d\u0e01\u0e1c\u0e25\",\r\n        ref: \"\u0e1b\u0e10\u0e21\u0e01\u0e32\u0e25 1:9-13\",\r\n        svg: `<svg viewBox=\"0 0 500 500\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\r\n          <rect width=\"500\" height=\"500\" fill=\"#0284c7\"\/>\r\n          <path d=\"M 0 300 Q 250 280 500 320 L 500 500 L 0 500 Z\" fill=\"#0284c7\"\/>\r\n          <path d=\"M 50 500 C 100 320, 220 260, 320 300 C 400 330, 420 400, 480 500 Z\" fill=\"#78350f\"\/>\r\n          <path d=\"M 70 500 C 120 340, 210 280, 310 320 C 380 350, 400 410, 460 500 Z\" fill=\"#15803d\"\/>\r\n          <g class=\"anim-float\">\r\n            <rect x=\"200\" y=\"270\" width=\"14\" height=\"40\" fill=\"#451a03\"\/>\r\n            <circle cx=\"207\" cy=\"250\" r=\"30\" fill=\"#166534\"\/>\r\n            <circle cx=\"190\" cy=\"260\" r=\"20\" fill=\"#22c55e\" opacity=\"0.8\"\/>\r\n            <rect x=\"280\" y=\"290\" width=\"18\" height=\"50\" fill=\"#451a03\"\/>\r\n            <circle cx=\"289\" cy=\"265\" r=\"40\" fill=\"#15803d\"\/>\r\n            <circle cx=\"305\" cy=\"250\" r=\"25\" fill=\"#4ade80\" opacity=\"0.9\"\/>\r\n          <\/g>\r\n        <\/svg>`\r\n      },\r\n      {\r\n        badge: \"\u0e27\u0e31\u0e19\u0e17\u0e35\u0e48 4\",\r\n        title: \"\u0e14\u0e27\u0e07\u0e2d\u0e32\u0e17\u0e34\u0e15\u0e22\u0e4c \u0e14\u0e27\u0e07\u0e08\u0e31\u0e19\u0e17\u0e23\u0e4c \u0e41\u0e25\u0e30\u0e14\u0e27\u0e07\u0e14\u0e32\u0e27\",\r\n        godSaid: \"\u201c\u0e08\u0e07\u0e21\u0e35\u0e14\u0e27\u0e07\u0e2a\u0e27\u0e48\u0e32\u0e07\u0e1a\u0e19\u0e41\u0e1c\u0e48\u0e19\u0e1f\u0e49\u0e32 \u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e41\u0e22\u0e01\u0e27\u0e31\u0e19\u0e2d\u0e2d\u0e01\u0e08\u0e32\u0e01\u0e04\u0e37\u0e19\u201d\",\r\n        desc: \"\u0e1e\u0e23\u0e30\u0e40\u0e08\u0e49\u0e32\u0e17\u0e23\u0e07\u0e2a\u0e23\u0e49\u0e32\u0e07\u0e14\u0e27\u0e07\u0e2a\u0e27\u0e48\u0e32\u0e07\u0e43\u0e2b\u0e0d\u0e48\u0e2a\u0e2d\u0e07\u0e14\u0e27\u0e07 \u0e43\u0e2b\u0e49\u0e14\u0e27\u0e07\u0e17\u0e35\u0e48\u0e43\u0e2b\u0e0d\u0e48\u0e01\u0e27\u0e48\u0e32\u0e1b\u0e01\u0e04\u0e23\u0e2d\u0e07\u0e04\u0e23\u0e2d\u0e07\u0e27\u0e31\u0e19 \u0e41\u0e25\u0e30\u0e14\u0e27\u0e07\u0e17\u0e35\u0e48\u0e40\u0e25\u0e47\u0e01\u0e01\u0e27\u0e48\u0e32\u0e1b\u0e01\u0e04\u0e23\u0e2d\u0e07\u0e04\u0e37\u0e19 \u0e41\u0e25\u0e30\u0e17\u0e23\u0e07\u0e2a\u0e23\u0e49\u0e32\u0e07\u0e14\u0e27\u0e07\u0e14\u0e32\u0e27\u0e15\u0e48\u0e32\u0e07\u0e46 \u0e14\u0e49\u0e27\u0e22 \u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e2a\u0e48\u0e2d\u0e07\u0e2a\u0e27\u0e48\u0e32\u0e07\u0e1a\u0e19\u0e41\u0e1c\u0e48\u0e19\u0e14\u0e34\u0e19\",\r\n        ref: \"\u0e1b\u0e10\u0e21\u0e01\u0e32\u0e25 1:14-19\",\r\n        svg: `<svg viewBox=\"0 0 500 500\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\r\n          <rect width=\"500\" height=\"500\" fill=\"#030712\"\/>\r\n          <g fill=\"#ffffff\" opacity=\"0.8\" class=\"anim-pulse\">\r\n            <circle cx=\"80\" cy=\"100\" r=\"2\"\/><circle cx=\"200\" cy=\"60\" r=\"1.5\"\/>\r\n            <circle cx=\"400\" cy=\"120\" r=\"2.5\"\/><circle cx=\"320\" cy=\"220\" r=\"1\"\/>\r\n            <circle cx=\"100\" cy=\"300\" r=\"2\"\/><circle cx=\"420\" cy=\"340\" r=\"1.5\"\/>\r\n          <\/g>\r\n          <g class=\"anim-spin\">\r\n            <circle cx=\"150\" cy=\"180\" r=\"60\" fill=\"url(#sunBright)\"\/>\r\n            <path d=\"M 150 100 L 150 70 M 150 260 L 150 290 M 70 180 L 40 180 M 230 180 L 260 180\" stroke=\"#fbbf24\" stroke-width=\"4\" stroke-linecap=\"round\"\/>\r\n          <\/g>\r\n          <g class=\"anim-float\">\r\n            <path d=\"M 330 220 A 50 50 0 1 0 410 300 A 60 60 0 1 1 330 220 Z\" fill=\"#e2e8f0\"\/>\r\n            <circle cx=\"370\" cy=\"260\" r=\"45\" fill=\"url(#moonGlow)\" opacity=\"0.3\"\/>\r\n          <\/g>\r\n          <defs>\r\n            <radialGradient id=\"sunBright\" cx=\"50%\" cy=\"50%\" r=\"50%\">\r\n              <stop offset=\"0%\" stop-color=\"#ffffff\"\/>\r\n              <stop offset=\"60%\" stop-color=\"#fbbf24\"\/>\r\n              <stop offset=\"100%\" stop-color=\"#d97706\"\/>\r\n            <\/radialGradient>\r\n            <radialGradient id=\"moonGlow\" cx=\"50%\" cy=\"50%\" r=\"50%\">\r\n              <stop offset=\"0%\" stop-color=\"#38bdf8\"\/>\r\n              <stop offset=\"100%\" stop-color=\"#030712\" stop-opacity=\"0\"\/>\r\n            <\/radialGradient>\r\n          <\/defs>\r\n        <\/svg>`\r\n      },\r\n      {\r\n        badge: \"\u0e27\u0e31\u0e19\u0e17\u0e35\u0e48 5\",\r\n        title: \"\u0e2a\u0e31\u0e15\u0e27\u0e4c\u0e19\u0e49\u0e33\u0e41\u0e25\u0e30\u0e19\u0e01\u0e43\u0e19\u0e2d\u0e32\u0e01\u0e32\u0e28\",\r\n        godSaid: \"\u201c\u0e43\u0e2b\u0e49\u0e19\u0e49\u0e33\u0e0a\u0e38\u0e01\u0e0a\u0e38\u0e21\u0e14\u0e49\u0e27\u0e22\u0e1d\u0e39\u0e07\u0e2a\u0e31\u0e15\u0e27\u0e4c\u0e17\u0e35\u0e48\u0e21\u0e35\u0e0a\u0e35\u0e27\u0e34\u0e15 \u0e41\u0e25\u0e30\u0e43\u0e2b\u0e49\u0e19\u0e01\u0e1a\u0e34\u0e19\u0e44\u0e1b\u0e21\u0e32\u0e40\u0e2b\u0e19\u0e37\u0e2d\u0e41\u0e1c\u0e48\u0e19\u0e14\u0e34\u0e19\u201d\",\r\n        desc: \"\u0e1e\u0e23\u0e30\u0e40\u0e08\u0e49\u0e32\u0e17\u0e23\u0e07\u0e2a\u0e23\u0e49\u0e32\u0e07\u0e2a\u0e31\u0e15\u0e27\u0e4c\u0e17\u0e30\u0e40\u0e25\u0e02\u0e19\u0e32\u0e14\u0e43\u0e2b\u0e0d\u0e48 \u0e41\u0e25\u0e30\u0e2a\u0e31\u0e15\u0e27\u0e4c\u0e21\u0e35\u0e0a\u0e35\u0e27\u0e34\u0e15\u0e17\u0e38\u0e01\u0e0a\u0e19\u0e34\u0e14\u0e17\u0e35\u0e48\u0e40\u0e04\u0e25\u0e37\u0e48\u0e2d\u0e19\u0e44\u0e2b\u0e27\u0e44\u0e1b\u0e21\u0e32\u0e2d\u0e22\u0e39\u0e48\u0e43\u0e19\u0e19\u0e49\u0e33\u0e15\u0e32\u0e21\u0e0a\u0e19\u0e34\u0e14\u0e02\u0e2d\u0e07\u0e21\u0e31\u0e19 \u0e41\u0e25\u0e30\u0e19\u0e01\u0e21\u0e35\u0e1b\u0e35\u0e01\u0e17\u0e38\u0e01\u0e0a\u0e19\u0e34\u0e14\u0e15\u0e32\u0e21\u0e0a\u0e19\u0e34\u0e14\u0e02\u0e2d\u0e07\u0e21\u0e31\u0e19 \u0e41\u0e25\u0e30\u0e1e\u0e23\u0e30\u0e40\u0e08\u0e49\u0e32\u0e17\u0e23\u0e07\u0e40\u0e2b\u0e47\u0e19\u0e27\u0e48\u0e32\u0e14\u0e35\",\r\n        ref: \"\u0e1b\u0e10\u0e21\u0e01\u0e32\u0e25 1:20-23\",\r\n        svg: `<svg viewBox=\"0 0 500 500\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\r\n          <rect width=\"500\" height=\"260\" fill=\"#38bdf8\"\/>\r\n          <rect y=\"260\" width=\"500\" height=\"240\" fill=\"#0284c7\"\/>\r\n          <g stroke=\"#1e293b\" stroke-width=\"3\" fill=\"none\" stroke-linecap=\"round\" class=\"anim-float\">\r\n            <path d=\"M 100 100 Q 115 85 130 100 Q 145 85 160 100\"\/>\r\n            <path d=\"M 280 70 Q 290 58 300 70 Q 310 58 320 70\"\/>\r\n            <path d=\"M 200 130 Q 212 118 224 130 Q 236 118 248 130\"\/>\r\n          <\/g>\r\n          <g class=\"anim-wave\">\r\n            <path d=\"M 180 380 C 220 330, 340 330, 380 380 C 350 420, 220 430, 180 380 Z\" fill=\"#0f172a\"\/>\r\n            <path d=\"M 375 375 L 420 350 L 410 380 L 425 405 Z\" fill=\"#0f172a\"\/>\r\n            <path d=\"M 240 340 C 240 300, 220 280, 210 270 M 240 340 C 250 300, 270 280, 280 270\" stroke=\"#e0f2fe\" stroke-width=\"3\" fill=\"none\"\/>\r\n          <\/g>\r\n        <\/svg>`\r\n      },\r\n      {\r\n        badge: \"\u0e27\u0e31\u0e19\u0e17\u0e35\u0e48 6\",\r\n        title: \"\u0e2a\u0e31\u0e15\u0e27\u0e4c\u0e1a\u0e19\u0e41\u0e1c\u0e48\u0e19\u0e14\u0e34\u0e19\u0e41\u0e25\u0e30\u0e21\u0e19\u0e38\u0e29\u0e22\u0e4c\",\r\n        godSaid: \"\u201c\u0e43\u0e2b\u0e49\u0e40\u0e23\u0e32\u0e2a\u0e23\u0e49\u0e32\u0e07\u0e21\u0e19\u0e38\u0e29\u0e22\u0e4c\u0e15\u0e32\u0e21\u0e09\u0e32\u0e22\u0e32\u0e02\u0e2d\u0e07\u0e40\u0e23\u0e32 \u0e15\u0e32\u0e21\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e02\u0e2d\u0e07\u0e40\u0e23\u0e32\u201d\",\r\n        desc: \"\u0e1e\u0e23\u0e30\u0e40\u0e08\u0e49\u0e32\u0e17\u0e23\u0e07\u0e2a\u0e23\u0e49\u0e32\u0e07\u0e2a\u0e31\u0e15\u0e27\u0e4c\u0e1b\u0e48\u0e32 \u0e2a\u0e31\u0e15\u0e27\u0e4c\u0e43\u0e0a\u0e49\u0e07\u0e32\u0e19 \u0e41\u0e25\u0e30\u0e2a\u0e31\u0e15\u0e27\u0e4c\u0e40\u0e25\u0e37\u0e49\u0e2d\u0e22\u0e04\u0e25\u0e32\u0e19 \u0e41\u0e25\u0e49\u0e27\u0e1e\u0e23\u0e30\u0e40\u0e08\u0e49\u0e32\u0e17\u0e23\u0e07\u0e2a\u0e23\u0e49\u0e32\u0e07\u0e21\u0e19\u0e38\u0e29\u0e22\u0e4c\u0e15\u0e32\u0e21\u0e1e\u0e23\u0e30\u0e09\u0e32\u0e22\u0e32\u0e02\u0e2d\u0e07\u0e1e\u0e23\u0e30\u0e2d\u0e07\u0e04\u0e4c \u0e17\u0e23\u0e07\u0e2a\u0e23\u0e49\u0e32\u0e07\u0e17\u0e31\u0e49\u0e07\u0e1c\u0e39\u0e49\u0e0a\u0e32\u0e22\u0e41\u0e25\u0e30\u0e1c\u0e39\u0e49\u0e2b\u0e0d\u0e34\u0e07 \u0e41\u0e25\u0e30\u0e17\u0e23\u0e07\u0e2d\u0e27\u0e22\u0e1e\u0e23\u0e40\u0e02\u0e32\u0e17\u0e31\u0e49\u0e07\u0e2b\u0e25\u0e32\u0e22\",\r\n        ref: \"\u0e1b\u0e10\u0e21\u0e01\u0e32\u0e25 1:24-31\",\r\n        svg: `<svg viewBox=\"0 0 500 500\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\r\n          <rect width=\"500\" height=\"500\" fill=\"#15803d\"\/>\r\n          <circle cx=\"250\" cy=\"200\" r=\"220\" fill=\"url(#warmGrace)\" class=\"anim-pulse\"\/>\r\n          <path d=\"M 80 380 C 90 320, 130 300, 160 340 C 180 320, 200 350, 190 400 Z\" fill=\"#78350f\"\/>\r\n          <g fill=\"#fef3c7\" opacity=\"0.9\" class=\"anim-float\">\r\n            <circle cx=\"230\" cy=\"220\" r=\"18\"\/>\r\n            <path d=\"M 215 245 C 215 240, 245 240, 245 245 L 248 330 L 235 330 L 230 280 L 225 330 L 212 330 Z\"\/>\r\n            <circle cx=\"275\" cy=\"225\" r=\"16\"\/>\r\n            <path d=\"M 260 250 C 260 245, 290 245, 290 250 L 295 330 L 282 330 L 275 285 L 268 330 L 255 330 Z\"\/>\r\n          <\/g>\r\n          <defs>\r\n            <radialGradient id=\"warmGrace\" cx=\"50%\" cy=\"50%\" r=\"50%\">\r\n              <stop offset=\"0%\" stop-color=\"#fef08a\" stop-opacity=\"0.6\"\/>\r\n              <stop offset=\"100%\" stop-color=\"#15803d\" stop-opacity=\"0\"\/>\r\n            <\/radialGradient>\r\n          <\/defs>\r\n        <\/svg>`\r\n      },\r\n      {\r\n        badge: \"\u0e27\u0e31\u0e19\u0e17\u0e35\u0e48 7\",\r\n        title: \"\u0e1e\u0e23\u0e30\u0e40\u0e08\u0e49\u0e32\u0e17\u0e23\u0e07\u0e2b\u0e22\u0e38\u0e14\u0e1e\u0e31\u0e01\",\r\n        godSaid: null,\r\n        desc: \"\u0e1f\u0e49\u0e32\u0e41\u0e25\u0e30\u0e41\u0e1c\u0e48\u0e19\u0e14\u0e34\u0e19\u0e41\u0e25\u0e30\u0e1a\u0e23\u0e34\u0e27\u0e32\u0e23\u0e17\u0e31\u0e49\u0e07\u0e2a\u0e34\u0e49\u0e19\u0e01\u0e47\u0e40\u0e2a\u0e23\u0e47\u0e08\u0e2a\u0e34\u0e49\u0e19\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e19\u0e31\u0e49\u0e19 \u0e43\u0e19\u0e27\u0e31\u0e19\u0e17\u0e35\u0e48\u0e40\u0e08\u0e47\u0e14\u0e1e\u0e23\u0e30\u0e40\u0e08\u0e49\u0e32\u0e01\u0e47\u0e40\u0e2a\u0e23\u0e47\u0e08\u0e07\u0e32\u0e19\u0e02\u0e2d\u0e07\u0e1e\u0e23\u0e30\u0e2d\u0e07\u0e04\u0e4c\u0e17\u0e35\u0e48\u0e44\u0e14\u0e49\u0e17\u0e23\u0e07\u0e17\u0e33\u0e21\u0e32\u0e19\u0e31\u0e49\u0e19 \u0e41\u0e25\u0e30\u0e43\u0e19\u0e27\u0e31\u0e19\u0e17\u0e35\u0e48\u0e40\u0e08\u0e47\u0e14\u0e1e\u0e23\u0e30\u0e2d\u0e07\u0e04\u0e4c\u0e17\u0e23\u0e07\u0e2b\u0e22\u0e38\u0e14\u0e1e\u0e31\u0e01\u0e08\u0e32\u0e01\u0e01\u0e32\u0e23\u0e07\u0e32\u0e19\u0e17\u0e31\u0e49\u0e07\u0e2a\u0e34\u0e49\u0e19\u0e02\u0e2d\u0e07\u0e1e\u0e23\u0e30\u0e2d\u0e07\u0e04\u0e4c \u0e1e\u0e23\u0e30\u0e40\u0e08\u0e49\u0e32\u0e08\u0e36\u0e07\u0e17\u0e23\u0e07\u0e2d\u0e27\u0e22\u0e1e\u0e23\u0e27\u0e31\u0e19\u0e17\u0e35\u0e48\u0e40\u0e08\u0e47\u0e14 \u0e41\u0e25\u0e30\u0e17\u0e23\u0e07\u0e15\u0e31\u0e49\u0e07\u0e44\u0e27\u0e49\u0e40\u0e1b\u0e47\u0e19\u0e27\u0e31\u0e19\u0e28\u0e31\u0e01\u0e14\u0e34\u0e4c\u0e2a\u0e34\u0e17\u0e18\u0e34\u0e4c\",\r\n        ref: \"\u0e1b\u0e10\u0e21\u0e01\u0e32\u0e25 2:1-3\",\r\n        svg: `<svg viewBox=\"0 0 500 500\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\r\n          <rect width=\"500\" height=\"500\" fill=\"#312e81\"\/>\r\n          <circle cx=\"250\" cy=\"250\" r=\"200\" fill=\"url(#restGlow)\" class=\"anim-pulse\"\/>\r\n          <g class=\"anim-float\" fill=\"none\" stroke=\"#fef08a\" stroke-width=\"3\">\r\n            <circle cx=\"250\" cy=\"230\" r=\"70\" opacity=\"0.5\"\/>\r\n            <circle cx=\"250\" cy=\"230\" r=\"90\" opacity=\"0.3\"\/>\r\n            <path d=\"M 200 230 L 250 170 L 300 230 L 270 270 L 230 270 Z\" fill=\"rgba(254, 240, 138, 0.2)\"\/>\r\n          <\/g>\r\n          <defs>\r\n            <radialGradient id=\"restGlow\" cx=\"50%\" cy=\"50%\" r=\"50%\">\r\n              <stop offset=\"0%\" stop-color=\"#6366f1\" stop-opacity=\"0.8\"\/>\r\n              <stop offset=\"50%\" stop-color=\"#4338ca\" stop-opacity=\"0.4\"\/>\r\n              <stop offset=\"100%\" stop-color=\"#312e81\" stop-opacity=\"0\"\/>\r\n            <\/radialGradient>\r\n          <\/defs>\r\n        <\/svg>`\r\n      }\r\n    ];\r\n\r\n    let currentIndex = 0;\r\n    let audioCtx = null;\r\n    let isAudioOn = false;\r\n\r\n    const visualPane = document.getElementById('visualPane');\r\n    const textContent = document.getElementById('textContent');\r\n    const dayBadge = document.getElementById('dayBadge');\r\n    const dayTitle = document.getElementById('dayTitle');\r\n    const godSaidContainer = document.getElementById('godSaidContainer');\r\n    const godSaidText = document.getElementById('godSaidText');\r\n    const dayDesc = document.getElementById('dayDesc');\r\n    const scriptureRef = document.getElementById('scriptureRef');\r\n    const prevBtn = document.getElementById('prevBtn');\r\n    const nextBtn = document.getElementById('nextBtn');\r\n    const pageDots = document.getElementById('pageDots');\r\n    const audioToggleBtn = document.getElementById('audioToggleBtn');\r\n    const audioIcon = document.getElementById('audioIcon');\r\n\r\n    function initDots() {\r\n      pageDots.innerHTML = '';\r\n      creationData.forEach((_, idx) => {\r\n        const dot = document.createElement('div');\r\n        dot.className = `dot ${idx === currentIndex ? 'active' : ''}`;\r\n        dot.addEventListener('click', () => goToPage(idx));\r\n        pageDots.appendChild(dot);\r\n      });\r\n    }\r\n\r\n    function renderPage(index) {\r\n      const data = creationData[index];\r\n      \r\n      textContent.classList.add('changing');\r\n\r\n      setTimeout(() => {\r\n        visualPane.innerHTML = data.svg;\r\n\r\n        dayBadge.textContent = data.badge;\r\n        dayTitle.textContent = data.title;\r\n        \r\n        if (data.godSaid) {\r\n          godSaidContainer.style.display = 'block';\r\n          godSaidText.textContent = data.godSaid;\r\n        } else {\r\n          godSaidContainer.style.display = 'none';\r\n        }\r\n\r\n        dayDesc.textContent = data.desc;\r\n        scriptureRef.textContent = data.ref;\r\n\r\n        prevBtn.disabled = index === 0;\r\n        nextBtn.textContent = index === creationData.length - 1 ? '\u0e40\u0e23\u0e34\u0e48\u0e21\u0e15\u0e49\u0e19\u0e43\u0e2b\u0e21\u0e48 \u21ba' : '\u0e16\u0e31\u0e14\u0e44\u0e1b \u2192';\r\n\r\n        const dots = pageDots.querySelectorAll('.dot');\r\n        dots.forEach((dot, i) => {\r\n          dot.className = `dot ${i === index ? 'active' : ''}`;\r\n        });\r\n\r\n        textContent.classList.remove('changing');\r\n        playPageTone(index);\r\n      }, 200);\r\n    }\r\n\r\n    function goToPage(index) {\r\n      if (index >= 0 && index < creationData.length) {\r\n        currentIndex = index;\r\n        renderPage(currentIndex);\r\n      }\r\n    }\r\n\r\n    function playPageTone(index) {\r\n      if (!isAudioOn) return;\r\n      try {\r\n        if (!audioCtx) {\r\n          audioCtx = new (window.AudioContext || window.webkitAudioContext)();\r\n        }\r\n        if (audioCtx.state === 'suspended') {\r\n          audioCtx.resume();\r\n        }\r\n        \r\n        const osc = audioCtx.createOscillator();\r\n        const gain = audioCtx.createGain();\r\n        \r\n        const baseFreqs = [261.63, 293.66, 329.63, 392.00, 440.00, 523.25, 587.33, 659.25];\r\n        const freq = baseFreqs[index % baseFreqs.length];\r\n\r\n        osc.type = 'sine';\r\n        osc.frequency.setValueAtTime(freq, audioCtx.currentTime);\r\n\r\n        gain.gain.setValueAtTime(0.01, audioCtx.currentTime);\r\n        gain.gain.exponentialRampToValueAtTime(0.15, audioCtx.currentTime + 0.1);\r\n        gain.gain.exponentialRampToValueAtTime(0.001, audioCtx.currentTime + 1.2);\r\n\r\n        osc.connect(gain);\r\n        gain.connect(audioCtx.destination);\r\n\r\n        osc.start();\r\n        osc.stop(audioCtx.currentTime + 1.2);\r\n      } catch (e) {\r\n        console.log(\"Audio not allowed yet\");\r\n      }\r\n    }\r\n\r\n    prevBtn.addEventListener('click', () => {\r\n      if (currentIndex > 0) goToPage(currentIndex - 1);\r\n    });\r\n\r\n    nextBtn.addEventListener('click', () => {\r\n      if (currentIndex < creationData.length - 1) {\r\n        goToPage(currentIndex + 1);\r\n      } else {\r\n        goToPage(0);\r\n      }\r\n    });\r\n\r\n    audioToggleBtn.addEventListener('click', () => {\r\n      isAudioOn = !isAudioOn;\r\n      audioIcon.textContent = isAudioOn ? '\ud83d\udd0a' : '\ud83d\udd07';\r\n      if (isAudioOn) playPageTone(currentIndex);\r\n    });\r\n\r\n    document.addEventListener('keydown', (e) => {\r\n      const bookElem = document.getElementById('creationBook');\r\n      if (!bookElem) return;\r\n      \r\n      const rect = bookElem.getBoundingClientRect();\r\n      const isVisible = rect.top < window.innerHeight && rect.bottom >= 0;\r\n\r\n      if (isVisible) {\r\n        if (e.key === 'ArrowRight') nextBtn.click();\r\n        if (e.key === 'ArrowLeft' && currentIndex > 0) prevBtn.click();\r\n      }\r\n    });\r\n\r\n    initDots();\r\n    renderPage(0);\r\n  })();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>\u0e2b\u0e19\u0e31\u0e07\u0e2a\u0e37\u0e2d\u0e1b\u0e23\u0e30\u0e27\u0e31\u0e15\u0e34\u0e01\u0e32\u0e23\u0e17\u0e23\u0e07\u0e2a\u0e23\u0e49\u0e32\u0e07 (\u0e1b\u0e10\u0e21\u0e01\u0e32\u0e25 1) \ud83d\udd0a \u0e40\u0e2a\u0e35\u0e22\u0e07 \u0e2b\u0e19\u0e49\u0e32 1 \u0e08\u0e32\u0e01 8 \u0e43\u0e19\u0e1b\u0e10\u0e21\u0e01\u0e32\u0e25 \u0e1e\u0e23\u0e30\u0e40\u0e08\u0e49\u0e32\u0e15\u0e23\u0e31\u0e2a\u0e27\u0e48\u0e32 &#8220;\u0e08\u0e07\u0e21\u0e35\u0e04\u0e27\u0e32\u0e21\u0e2a\u0e27\u0e48\u0e32\u0e07&#8221; \u0e43\u0e19\u0e1b\u0e10\u0e21\u0e01\u0e32\u0e25 \u0e1e\u0e23\u0e30\u0e40\u0e08\u0e49\u0e32\u0e17\u0e23\u0e07\u0e40\u0e19\u0e23\u0e21\u0e34\u0e15\u0e2a\u0e23\u0e49\u0e32\u0e07\u0e1f\u0e49\u0e32\u0e41\u0e25\u0e30\u0e41\u0e1c\u0e48\u0e19\u0e14\u0e34\u0e19 \u0e41\u0e1c\u0e48\u0e19\u0e14\u0e34\u0e19\u0e01\u0e47\u0e27\u0e48\u0e32\u0e07\u0e40\u0e1b\u0e25\u0e48\u0e32\u0e41\u0e25\u0e30\u0e21\u0e35\u0e04\u0e27\u0e32\u0e21\u0e21\u0e37\u0e14\u0e2d\u0e22\u0e39\u0e48\u0e40\u0e2b\u0e19\u0e37\u0e2d\u0e2b\u0e49\u0e27\u0e07\u0e19\u0e49\u0e33 \u0e1b\u0e10\u0e21\u0e01\u0e32\u0e25 1:1-2 \u2190 \u0e22\u0e49\u0e2d\u0e19\u0e01\u0e25\u0e31\u0e1a \u0e16\u0e31\u0e14\u0e44\u0e1b \u2192<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"footnotes":""},"class_list":["post-116","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/nathanwp.bakj.eu\/index.php?rest_route=\/wp\/v2\/pages\/116","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/nathanwp.bakj.eu\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/nathanwp.bakj.eu\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/nathanwp.bakj.eu\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/nathanwp.bakj.eu\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=116"}],"version-history":[{"count":10,"href":"https:\/\/nathanwp.bakj.eu\/index.php?rest_route=\/wp\/v2\/pages\/116\/revisions"}],"predecessor-version":[{"id":128,"href":"https:\/\/nathanwp.bakj.eu\/index.php?rest_route=\/wp\/v2\/pages\/116\/revisions\/128"}],"wp:attachment":[{"href":"https:\/\/nathanwp.bakj.eu\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=116"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}