updated tagline and icon

public/assets/logo.svg

@@ -0,0 +1,5 @@
+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg width="1000" height="1000" viewBox="0 0 1000 1000" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
+    <path d="M500,0C775.958,0 1000,224.042 1000,500C1000,775.958 775.958,1000 500,1000C224.042,1000 0,775.958 0,500C0,224.042 224.042,0 500,0ZM500,35.726C243.754,35.726 35.714,243.76 35.714,500C35.714,756.24 243.754,964.274 500,964.274C756.246,964.274 964.286,756.24 964.286,500C964.286,243.76 756.246,35.726 500,35.726ZM700,626.471C740.582,626.471 773.529,659.418 773.529,700C773.529,740.582 740.582,773.529 700,773.529C659.418,773.529 626.471,740.582 626.471,700C626.471,659.418 659.418,626.471 700,626.471ZM700,226.471C740.582,226.471 773.529,259.418 773.529,300C773.529,340.582 740.582,373.529 700,373.529C659.418,373.529 626.471,340.582 626.471,300C626.471,259.418 659.418,226.471 700,226.471ZM300,226.471C340.582,226.471 373.529,259.418 373.529,300C373.529,340.582 340.582,373.529 300,373.529C259.418,373.529 226.471,340.582 226.471,300C226.471,259.418 259.418,226.471 300,226.471ZM300,626.471C340.582,626.471 373.529,659.418 373.529,700C373.529,740.582 340.582,773.529 300,773.529C259.418,773.529 226.471,740.582 226.471,700C226.471,659.418 259.418,626.471 300,626.471ZM447.059,552.941L132.353,552.941L132.353,447.059L447.059,447.059L447.059,132.353L552.941,132.353L552.941,447.059L867.647,447.059L867.647,552.941L552.941,552.941L552.941,867.647L447.059,867.647L447.059,552.941Z"/>
+</svg>

src/components/Header.tsx

@@ -1,17 +1,31 @@
 import React from 'react';
 import Link from 'next/link';
+import Image from "next/image";
 
 const Header: React.FC = () => {
   return (
     <header className="bg-white shadow-sm border-b border-primary-200">
       <div className="container mx-auto px-4 py-6">
         <div className="flex flex-col md:flex-row justify-between items-center">
-          <div className="mb-4 md:mb-0">
+          <Link href="/" className="no-underline">
-            <Link href="/" className="no-underline">
+            <div className="mb-4 md:mb-0 flex items-center space-x-4">
+            
+              <Image
+              src="/assets/logo.svg"
+              alt="Logo"
+              width={100}
+              height={100}
+              className="h-auto w-auto max-h-12"
+              />
+            
+            <div>
+              
               <h1 className="text-3xl font-bold text-primary-900 mb-0">Confessions of Grace</h1>
-            </Link>
+              
-            <p className="text-primary-500 italic text-sm">Exploring Reformed Theology</p>
+              <p className="text-primary-500 italic text-sm">Confessing Christ. Rejoicing in Grace.</p>
-          </div>
+            </div>
+            </div>
+          </Link>
           <nav className="flex space-x-6">
             <Link href="/" className="text-primary-700 hover:text-accent-dark">
               Home

src/components/Meta.tsx

@@ -19,7 +19,7 @@ const Meta: React.FC<MetaProps> = ({
   type = 'website'
 }) => {
   const siteTitle = title === 'Confessions of Grace' 
-    ? 'Confessions of Grace | Reformed Theology Blog' 
+    ? 'Confessions of Grace | Confessing Christ. Rejoicing in Grace.' 
     : `${title} | Confessions of Grace`;
 
   image = image.startsWith('http') ? image : `https://www.confessionsofgrace.com${image}`;
@@ -39,7 +39,7 @@ const Meta: React.FC<MetaProps> = ({
       <meta property="og:description" content={description} />
       <meta property="og:image" content={image} />
       <meta property="og:locale" content="en_US" />
-      <meta property="og:logo" content="/favicon.ico" />
+      <meta property="og:logo" content="/logo.svg" />
         
       {/* Twitter */}
       <meta property="twitter:card" content="summary" />

src/pages/index.tsx

@@ -27,7 +27,7 @@ const Home: React.FC<HomeProps> = ({ posts, recentPosts, tags }) => {
       <Meta
         title="Confessions of Grace"
         keywords="reformed theology, doctrines of grace, christianity, calvinism, theology"
-        image="public/favicon.ico"
+        image="public/assets/logo-horizontal.svg"
         url="https://www.confessionsofgrace.com/"
         type="website"
       />