howdy-jekyll-theme 1.0.0

data/_includes/head.html

@@ -0,0 +1,137 @@
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
+
+<meta name="description" content="{% if page.description %}{{ page.description }}{% elsif page.excerpt %}{{ page.excerpt | strip_html | truncate: 160 }}{% else %}{{ site.description }}{% endif %}">
+
+<!-- Theme color -->
+{% if site.theme_color %}
+<meta name="theme-color" content="{{ site.theme_color }}">
+{% endif %}
+
+<!-- Favicons -->
+{% if site.favicon_dark %}
+<link rel="icon" href="{{ site.favicon_dark | relative_url }}" media="(prefers-color-scheme: dark)">
+{% endif %}
+{% if site.favicon %}
+<link rel="icon" href="{{ site.favicon | relative_url }}" media="(prefers-color-scheme: light)">
+{% endif %}
+{% if site.apple_touch_icon %}
+<link rel="apple-touch-icon" href="{{ site.apple_touch_icon | relative_url }}">
+{% endif %}
+
+<!-- Open Graph / Facebook -->
+<meta property="og:type" content="website">
+<meta property="og:description" content="{% if page.description %}{{ page.description }}{% elsif page.excerpt %}{{ page.excerpt | strip_html | truncate: 160 }}{% else %}{{ site.description }}{% endif %}">
+{% assign og_img = page.image | default: site.og_image %}
+{% if og_img %}
+<meta property="og:image" content="{{ og_img | absolute_url }}">
+{% endif %}
+
+<!-- Twitter -->
+<meta name="twitter:card" content="summary_large_image">
+<meta name="twitter:description" content="{% if page.description %}{{ page.description }}{% elsif page.excerpt %}{{ page.excerpt | strip_html | truncate: 160 }}{% else %}{{ site.description }}{% endif %}">
+{% if og_img %}
+<meta name="twitter:image" content="{{ og_img | absolute_url }}">
+{% endif %}
+
+<!-- RSS Feed -->
+{% feed_meta %}
+
+<!-- SEO Tag -->
+{% seo %}
+
+
+
+<!-- Local fonts -->
+<style>
+  @font-face {
+    font-family: 'Chaumont Script';
+    src: url('{{ '/assets/fonts/ChaumontScript-Regular.otf' | relative_url }}') format('opentype');
+    font-weight: 400;
+    font-style: normal;
+    font-display: swap;
+  }
+
+  @font-face {
+    font-family: 'DM Sans';
+    src: url('{{ '/assets/fonts/DMSans-Variable.ttf' | relative_url }}') format('truetype');
+    font-weight: 100 900;
+    font-style: normal;
+    font-display: swap;
+  }
+
+  @font-face {
+    font-family: 'DM Sans';
+    src: url('{{ '/assets/fonts/DMSans-Italic-Variable.ttf' | relative_url }}') format('truetype');
+    font-weight: 100 900;
+    font-style: italic;
+    font-display: swap;
+  }
+
+</style>
+
+<!-- Custom CSS injection -->
+{% if site.custom_css %}
+<link rel="stylesheet" href="{{ site.custom_css | relative_url }}">
+{% endif %}
+
+<!-- Swiper CSS -->
+<link rel="stylesheet" href="{{ '/assets/css/swiper-bundle.min.css' | relative_url }}">
+
+<!-- Stylesheet -->
+<link rel="stylesheet" href="{{ '/assets/css/main.css' | relative_url }}">
+
+<!-- Dark mode script (inline for immediate execution) -->
+<script>
+  (function() {
+    const root = document.documentElement;
+    const saved = localStorage.getItem('howdy-theme');
+    {% if site.default_theme and site.default_theme != "auto" %}
+    const defaultMode = '{{ site.default_theme }}';
+    if (saved === 'dark') {
+      root.classList.add('dark-mode');
+      root.classList.remove('light-mode');
+    } else if (saved === 'light') {
+      root.classList.add('light-mode');
+      root.classList.remove('dark-mode');
+    } else {
+      root.classList.add('{{ site.default_theme }}-mode');
+    }
+    {% else %}
+    if (saved === 'dark') {
+      root.classList.add('dark-mode');
+    } else if (saved === 'light') {
+      root.classList.add('light-mode');
+    } else if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
+      root.classList.add('dark-mode');
+    }
+    {% endif %}
+  })();
+</script>
+
+<!-- Theme toggle icon state — set before first paint to prevent flash -->
+<style>
+  .sun-icon { display: none; }
+  .moon-icon { display: block; }
+  html.dark-mode .sun-icon { display: block; }
+  html.dark-mode .moon-icon { display: none; }
+</style>
+
+<!-- Page reveal — content starts hidden, revealed after first paint -->
+<style>
+  .hero-content,
+  .content-area > *,
+  .company-logos,
+  .stats,
+  .hero-carousel,
+  .logo-overlay {
+    opacity: 0;
+  }
+</style>
+<script>
+  requestAnimationFrame(function() {
+    requestAnimationFrame(function() {
+      document.body.classList.add('loaded');
+    });
+  });
+</script>

data/_includes/hero-carousel.html

@@ -0,0 +1,80 @@
+{% comment %}
+  Hero Carousel Include
+  Supports single `hero_image` (backward compatible) and array `hero_images`
+  or auto-gathering from collection featured images on index pages.
+  Fallback to placeholder if no images exist.
+{% endcomment %}
+
+{% assign images = "" | split: "" %}
+
+{% comment %}Priority: page.hero_images > collection images > page.hero_image > site.hero_images > site.hero_image{% endcomment %}
+{% if page.hero_images and page.hero_images != empty %}
+  {% for img in page.hero_images %}
+    {% assign images = images | push: img %}
+  {% endfor %}
+
+{% comment %}Projects index — gather from all projects{% endcomment %}
+{% elsif page.url == '/projects/' %}
+  {% assign sorted_projects = site.projects | sort: 'year' | reverse %}
+  {% for project in sorted_projects %}
+    {% if project.image %}
+      {% assign images = images | push: project.image %}
+    {% endif %}
+  {% endfor %}
+
+{% comment %}Blog index — use config or auto-gather{% endcomment %}
+{% elsif page.layout == 'blog' %}
+  {% if site.blog.hero_images %}
+    {% for img in site.blog.hero_images %}
+      {% assign images = images | push: img %}
+    {% endfor %}
+  {% else %}
+    {% assign limit = site.blog.hero_image_limit | default: site.posts.size %}
+    {% assign counter = 0 %}
+    {% for post in site.posts limit: limit %}
+      {% if post.image %}
+        {% assign images = images | push: post.image %}
+        {% assign counter = counter | plus: 1 %}
+      {% endif %}
+    {% endfor %}
+  {% endif %}
+{% endif %}
+
+{% comment %}Fallback to single image if no collection images found{% endcomment %}
+{% if images == empty %}
+  {% if page.hero_image and page.hero_image != "" %}
+    {% assign images = images | push: page.hero_image %}
+  {% elsif page.image and page.image != "" %}
+    {% assign images = images | push: page.image %}
+  {% elsif site.hero_images and site.hero_images != empty %}
+    {% for img in site.hero_images %}
+      {% assign images = images | push: img %}
+    {% endfor %}
+  {% elsif site.hero_image and site.hero_image != "" %}
+    {% assign images = images | push: site.hero_image %}
+  {% endif %}
+{% endif %}
+
+{% assign image_count = images | size %}
+
+{% if image_count == 0 %}
+  <div class="hero-placeholder"></div>
+{% elsif image_count == 1 %}
+  <img src="{{ images.first | relative_url }}" alt="Hero" class="hero-image">
+{% else %}
+  <div class="hero-carousel swiper" aria-label="Hero image carousel">
+    <div class="swiper-wrapper">
+      {% for img in images %}
+        <div class="swiper-slide">
+          <img
+            src="{{ img | relative_url }}"
+            alt="Hero slide {{ forloop.index }}"
+            class="hero-carousel__slide"
+            loading="{% if forloop.first %}eager{% else %}lazy{% endif %}"
+          >
+        </div>
+      {% endfor %}
+    </div>
+    <div class="hero-carousel__dots"></div>
+  </div>
+{% endif %}

data/_includes/logo.html

@@ -0,0 +1,5 @@
+<a href="{{ '/' | relative_url }}" class="site-logo" aria-label="{{ site.title | default: 'Home' }}">
+  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 100" width="160" height="80" class="site-logo-svg" role="img" aria-hidden="true">
+    <text x="50%" y="60%" text-anchor="middle" dominant-baseline="middle" class="logo-text">{{ site.logo_text | default: "Howdy" }}</text>
+  </svg>
+</a>

data/_includes/navigation.html

@@ -0,0 +1,24 @@
+<button class="nav-toggle" aria-label="Toggle navigation" aria-expanded="false">
+  <span class="nav-toggle-icon"></span>
+</button>
+
+<div class="nav-overlay"></div>
+
+<nav class="site-nav">
+  {% for item in site.navigation %}
+    {% assign item_url = item.url | relative_url %}
+    {% assign page_url = page.url | relative_url %}
+    {% assign is_active = false %}
+
+    {% if item.url == "/" %}
+      {% if page_url == "/" or page_url == "" %}
+        {% assign is_active = true %}
+      {% endif %}
+    {% elsif page_url contains item_url %}
+      {% assign is_active = true %}
+    {% endif %}
+
+    <a href="{{ item_url }}" {% if is_active %}class="active"{% endif %} {% if item.external %}target="_blank" rel="noopener noreferrer"{% endif %}>{{ item.title }}</a>
+  {% endfor %}
+  {% include dark-mode-toggle.html %}
+</nav>

data/_includes/newsletter.html

@@ -0,0 +1,10 @@
+{% if site.newsletter and site.newsletter.enabled %}
+<div class="newsletter">
+  <h3>{{ site.newsletter.title | default: "Stay in the loop" }}</h3>
+  <p>{{ site.newsletter.description | default: "Get occasional updates — no spam, ever." }}</p>
+  <form action="{{ site.newsletter.action_url }}" method="post" target="_blank" class="newsletter-form">
+    <input type="email" name="EMAIL" placeholder="{{ site.newsletter.placeholder | default: 'your@email.com' }}" required aria-label="Email address">
+    <button type="submit">{{ site.newsletter.button_text | default: "Subscribe" }}</button>
+  </form>
+</div>
+{% endif %}

data/_includes/share-buttons.html

@@ -0,0 +1,70 @@
+{% if site.share_buttons and site.share_buttons.enabled %}
+<div class="share-buttons">
+  <span class="share-label">Share</span>
+  {% assign page_url = page.url | absolute_url | url_encode %}
+  {% assign page_title = page.title | url_encode %}
+
+  {% if site.share_buttons.platforms contains "twitter" %}
+  <a href="https://twitter.com/intent/tweet?url={{ page_url }}&text={{ page_title }}" target="_blank" rel="noopener noreferrer" class="share-btn" aria-label="Share on Twitter">
+    <svg viewBox="0 0 24 24" fill="currentColor"><path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z"/></svg>
+  </a>
+  {% endif %}
+
+  {% if site.share_buttons.platforms contains "linkedin" %}
+  <a href="https://www.linkedin.com/sharing/share-offsite/?url={{ page_url }}" target="_blank" rel="noopener noreferrer" class="share-btn" aria-label="Share on LinkedIn">
+    <svg viewBox="0 0 24 24" fill="currentColor"><path d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433a2.062 2.062 0 01-2.063-2.065 2.064 2.064 0 112.063 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z"/></svg>
+  </a>
+  {% endif %}
+
+  {% if site.share_buttons.platforms contains "facebook" %}
+  <a href="https://www.facebook.com/sharer/sharer.php?u={{ page_url }}" target="_blank" rel="noopener noreferrer" class="share-btn" aria-label="Share on Facebook">
+    <svg viewBox="0 0 24 24" fill="currentColor"><path d="M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z"/></svg>
+  </a>
+  {% endif %}
+
+  {% if site.share_buttons.platforms contains "reddit" %}
+  <a href="https://reddit.com/submit?url={{ page_url }}&title={{ page_title }}" target="_blank" rel="noopener noreferrer" class="share-btn" aria-label="Share on Reddit">
+    <svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 0A12 12 0 0012 24 12 12 0 0012 0zM18.94 8.21a1.87 1.87 0 011.87 1.87c0 .77-.47 1.43-1.13 1.72.04.24.06.48.06.72 0 3.14-3.2 5.68-7.14 5.68S5.46 15.66 5.46 12.52c0-.24.02-.48.06-.72a1.87 1.87 0 01-.92-1.62A1.9 1.9 0 016.5 8.28a1.9 1.9 0 011.73 1.05 5.6 5.6 0 013.33-1.06l.63-2.98.01-.01.01-.01a.1.1 0 01.07-.06l2.1-.44a1.35 1.35 0 011.23 2.1c.4.2.68.61.68 1.09a1.35 1.35 0 01-1.35 1.35 1.35 1.35 0 01-1.35-1.35c0-.4.18-.76.46-1.01l-1.63.34-.51 2.41c1.39.03 2.66.39 3.68 1.06a1.9 1.9 0 011.66-.95zm-8.2 4.78a1.31 1.31 0 00-1.31 1.31 1.31 1.31 0 001.31 1.31 1.31 1.31 0 001.31-1.31 1.3 1.3 0 00-1.31-1.31zm3.91 2.83c-.3.3-.87.43-1.55.43s-1.24-.12-1.54-.43a.39.39 0 00-.55 0 .39.39 0 000 .55c.52.52 1.2.5 2.09.5s1.58.03 2.1-.5a.39.39 0 000-.55.39.39 0 00-.55 0zm-.22-1.52a1.31 1.31 0 001.31-1.31 1.31 1.31 0 00-1.31-1.31 1.31 1.31 0 00-1.31 1.31 1.3 1.3 0 001.31 1.31z"/></svg>
+  </a>
+  {% endif %}
+
+  {% if site.share_buttons.platforms contains "hackernews" %}
+  <a href="https://news.ycombinator.com/submitlink?u={{ page_url }}&t={{ page_title }}" target="_blank" rel="noopener noreferrer" class="share-btn" aria-label="Share on Hacker News">
+    <svg viewBox="0 0 24 24" fill="currentColor"><path d="M0 24V0h24v24H0zM6.951 5.896l4.112 7.708v5.064h1.583v-5.064l4.148-7.708h-1.63l-2.608 5.064a85.07 85.07 0 00-.625 1.288 119.28 119.28 0 00-.515-1.072l-2.7-5.28H6.95z"/></svg>
+  </a>
+  {% endif %}
+
+  {% if site.share_buttons.platforms contains "whatsapp" %}
+  <a href="https://wa.me/?text={{ page_title | url_encode }}%20{{ page_url }}" target="_blank" rel="noopener noreferrer" class="share-btn" aria-label="Share on WhatsApp">
+    <svg viewBox="0 0 24 24" fill="currentColor"><path d="M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.76-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 00-3.48-8.413z"/></svg>
+  </a>
+  {% endif %}
+
+  {% if site.share_buttons.platforms contains "telegram" %}
+  <a href="https://t.me/share/url?url={{ page_url }}&text={{ page_title }}" target="_blank" rel="noopener noreferrer" class="share-btn" aria-label="Share on Telegram">
+    <svg viewBox="0 0 24 24" fill="currentColor"><path d="M11.944 0A12 12 0 000 12a12 12 0 0012 12 12 12 0 0012-12A12 12 0 0012 0a12 12 0 00-.056 0zm4.962 7.224c.1-.002.321.023.465.14a.506.506 0 01.171.325c.016.093.036.306.02.472-.18 1.898-.962 6.502-1.36 8.627-.168.9-.499 1.201-.82 1.23-.696.065-1.225-.46-1.9-.902-1.056-.693-1.653-1.124-2.678-1.8-1.185-.78-.417-1.21.258-1.91.177-.184 3.247-2.977 3.307-3.23.007-.032.014-.15-.056-.212s-.174-.041-.249-.024c-.106.024-1.793 1.14-5.061 3.345-.48.33-.913.49-1.302.48-.428-.008-1.252-.241-1.865-.44-.752-.245-1.349-.374-1.297-.789.027-.216.325-.437.893-.663 3.498-1.524 5.83-2.529 6.998-3.014 3.332-1.386 4.025-1.627 4.476-1.635z"/></svg>
+  </a>
+  {% endif %}
+
+  {% if site.share_buttons.platforms contains "email" %}
+  <a href="mailto:?subject={{ page_title }}&body={{ page_url }}" target="_blank" rel="noopener noreferrer" class="share-btn" aria-label="Share via Email">
+    <svg viewBox="0 0 24 24" fill="currentColor"><path d="M20 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 4l-8 5-8-5V6l8 5 8-5v2z"/></svg>
+  </a>
+  {% endif %}
+
+  <button class="share-btn share-copy" aria-label="Copy link" data-url="{{ page.url | absolute_url }}">
+    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M10 13a5 5 0 007.54.54l3-3a5 5 0 00-7.07-7.07l-1.72 1.71"/><path d="M14 11a5 5 0 00-7.54-.54l-3 3a5 5 0 007.07 7.07l1.71-1.71"/></svg>
+  </button>
+</div>
+
+<script>
+document.querySelector('.share-copy')?.addEventListener('click', function() {
+  const url = this.dataset.url;
+  navigator.clipboard.writeText(url).then(() => {
+    const original = this.innerHTML;
+    this.innerHTML = '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"/></svg>';
+    setTimeout(() => { this.innerHTML = original; }, 2000);
+  });
+});
+</script>
+{% endif %}

data/_includes/social-links.html

@@ -0,0 +1,37 @@
+<div class="social-links">
+  {% if site.social.github %}
+    <a href="{{ site.social.github }}" target="_blank" rel="noopener noreferrer" aria-label="GitHub">
+      <svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor">
+        <path d="M8 0c-4.42 0-8 3.58-8 8a8 8 0 0 0 5.47 7.59c.4.07.55-.17.55-.38s-.01-.86-.01-1.7c-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82a7.6 7.6 0 0 1 4 0c1.52-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8 8 0 0 0 16 8c0-4.42-3.58-8-8-8"/>
+      </svg>
+    </a>
+  {% endif %}
+  {% if site.social.twitter or site.social.x %}
+    <a href="{{ site.social.x | default: site.social.twitter }}" target="_blank" rel="noopener noreferrer" aria-label="X (Twitter)">
+      <svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor">
+        <path d="M12.6.75h2.454l-5.36 6.142L16 15.25h-4.937l-3.867-5.07-4.425 5.07H.316l5.733-6.57L0 .75h5.063l3.495 4.633L12.601.75Zm-.86 13.028h1.36L4.323 2.145H2.865l8.875 11.633Z"/>
+      </svg>
+    </a>
+  {% endif %}
+  {% if site.social.linkedin %}
+    <a href="{{ site.social.linkedin }}" target="_blank" rel="noopener noreferrer" aria-label="LinkedIn">
+      <svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor">
+        <path d="M0 1.146C0 .513.526 0 1.175 0h13.65C15.474 0 16 .513 16 1.146v13.708c0 .633-.526 1.146-1.175 1.146H1.175C.526 16 0 15.487 0 14.854zm4.943 12.248V6.169H2.542v7.225zm-1.2-8.212c.837 0 1.358-.554 1.358-1.248-.015-.709-.52-1.248-1.342-1.248S2.4 3.226 2.4 3.934c0 .694.521 1.248 1.327 1.248zm4.908 8.212V9.359c0-.216.016-.432.08-.586.173-.431.568-.878 1.232-.878.869 0 1.216.662 1.216 1.634v3.865h2.401V9.25c0-2.22-1.184-3.252-2.764-3.252-1.274 0-1.845.7-2.165 1.193v.025h-.016l.016-.025V6.169h-2.4c.03.678 0 7.225 0 7.225z"/>
+      </svg>
+    </a>
+  {% endif %}
+  {% if site.social.instagram %}
+    <a href="{{ site.social.instagram }}" target="_blank" rel="noopener noreferrer" aria-label="Instagram">
+      <svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor">
+        <path d="M8 0C5.829 0 5.556.01 4.703.048 3.85.088 3.269.222 2.76.42a3.917 3.917 0 0 0-1.417.923A3.927 3.927 0 0 0 .42 2.76C.222 3.268.087 3.85.048 4.7.01 5.555 0 5.827 0 8.001c0 2.172.01 2.444.048 3.297.04.852.174 1.433.372 1.942.205.526.478.972.923 1.417.444.445.89.719 1.416.923.51.198 1.09.333 1.942.372C5.555 15.99 5.827 16 8 16s2.444-.01 3.298-.048c.851-.04 1.434-.174 1.943-.372a3.916 3.916 0 0 0 1.416-.923c.445-.445.718-.891.923-1.417.197-.509.332-1.09.372-1.942C15.99 10.445 16 10.173 16 8s-.01-2.445-.048-3.299c-.04-.851-.175-1.433-.372-1.941a3.926 3.926 0 0 0-.923-1.417A3.911 3.911 0 0 0 13.24.42c-.51-.198-1.092-.333-1.943-.372C10.443.01 10.172 0 7.998 0h.003zm-.717 1.442h.718c2.136 0 2.389.007 3.232.046.78.035 1.204.166 1.486.275.373.145.64.319.92.599.28.28.453.546.598.92.11.281.24.705.275 1.485.039.843.047 1.096.047 3.231s-.008 2.389-.047 3.232c-.035.78-.166 1.203-.275 1.485a2.47 2.47 0 0 1-.599.919c-.28.28-.546.453-.92.598-.28.11-.704.24-1.485.276-.843.038-1.096.047-3.232.047s-2.39-.009-3.233-.047c-.78-.036-1.203-.166-1.485-.276a2.478 2.478 0 0 1-.92-.598 2.48 2.48 0 0 1-.6-.92c-.109-.281-.24-.705-.275-1.485-.038-.843-.046-1.096-.046-3.233 0-2.136.008-2.388.046-3.231.036-.78.166-1.204.276-1.486.145-.373.319-.64.599-.92.28-.28.546-.453.92-.598.282-.11.705-.24 1.485-.276.738-.034 1.024-.044 2.515-.045v.002zm4.988 1.328a.96.96 0 1 0 0 1.92.96.96 0 0 0 0-1.92zm-4.27 1.122a4.109 4.109 0 1 0 0 8.217 4.109 4.109 0 0 0 0-8.217zm0 1.441a2.667 2.667 0 1 1 0 5.334 2.667 2.667 0 0 1 0-5.334z"/>
+      </svg>
+    </a>
+  {% endif %}
+  {% if site.social.dribbble %}
+    <a href="{{ site.social.dribbble }}" target="_blank" rel="noopener noreferrer" aria-label="Dribbble">
+      <svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor">
+        <path fill-rule="evenodd" d="M8 0C3.584 0 0 3.584 0 8s3.584 8 8 8c4.408 0 8-3.584 8-8s-3.592-8-8-8m5.284 3.688a6.8 6.8 0 0 1 1.545 4.251c-.226-.043-2.482-.503-4.755-.217-.052-.112-.096-.234-.148-.355-.139-.33-.295-.668-.451-.99 2.516-1.023 3.662-2.498 3.81-2.69zM8 1.18c1.735 0 3.323.65 4.53 1.718-.122.174-1.155 1.553-3.584 2.464-1.12-2.056-2.36-3.74-2.551-4A7 7 0 0 1 8 1.18m-2.907.642A43 43 0 0 1 7.627 5.77c-3.193.85-6.013.833-6.317.833a6.87 6.87 0 0 1 3.783-4.78zM1.163 8.01V7.8c.295.01 3.61.053 7.02-.971.199.381.381.772.555 1.162l-.27.078c-3.522 1.137-5.396 4.243-5.553 4.504a6.82 6.82 0 0 1-1.752-4.564zM8 14.837a6.8 6.8 0 0 1-4.19-1.44c.12-.252 1.509-2.924 5.361-4.269.018-.009.026-.009.044-.017a28.3 28.3 0 0 1 1.457 5.18A6.7 6.7 0 0 1 8 14.837m3.81-1.171c-.07-.417-.435-2.412-1.328-4.868 2.143-.338 4.017.217 4.251.295a6.77 6.77 0 0 1-2.924 4.573z"/>
+      </svg>
+    </a>
+  {% endif %}
+</div>

data/_includes/toc.html

@@ -0,0 +1,29 @@
+{% assign min_h = include.min_heading | default: 2 %}
+{% assign max_h = include.max_heading | default: 3 %}
+{% assign raw_content = include.content %}
+
+{% assign heading_items = raw_content | split: '<h' | where_exp: "item", "item != ''" %}
+
+{% assign toc_items = "" | split: "" %}
+
+{% for item in heading_items %}
+  {% assign level = item | slice: 0 | plus: 0 %}
+  {% if level >= min_h and level <= max_h %}
+    {% assign tag_attrs = item | split: '>' | first %}
+    {% assign id = tag_attrs | split: 'id="' | last | split: '"' | first %}
+    {% assign content_after_tag = item | remove_first: tag_attrs | remove_first: '>' %}
+    {% assign text = content_after_tag | split: '</h' | first %}
+    {% assign indent = level | minus: min_h | times: 16 %}
+    {% assign toc_item = '<a href="#' | append: id | append: '" style="padding-left:' | append: indent | append: 'px;">' | append: text | append: '</a>' %}
+    {% assign toc_items = toc_items | push: toc_item %}
+  {% endif %}
+{% endfor %}
+
+{% if toc_items.size > 0 %}
+<nav class="toc" aria-label="Table of contents">
+  <span class="toc-title">On this page</span>
+  {% for item in toc_items %}
+    {{ item }}
+  {% endfor %}
+</nav>
+{% endif %}

data/_layouts/autopage_collection.html

@@ -0,0 +1,43 @@
+---
+layout: default
+---
+
+<section class="two-column">
+  <div class="left-section">
+    <div class="left-container">
+      <div class="image-wrapper">
+        <div class="hero-content">
+          {% include hero-carousel.html %}
+          <div class="logo-overlay">{% include logo.html %}</div>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <div class="right-section">
+    <div class="content-wrapper">
+      {% include navigation.html %}
+      <div class="content-area">
+        <h1>{{ page.title | default: "Blog" }}</h1>
+        <p class="body-large" style="color: var(--howdy-text-secondary);">{{ page.description | default: page.autopage_display_name | default: "Welcome to the blog." }}</p>
+
+        <div class="posts-grid" style="margin-top: 48px;">
+          {% for post in paginator.posts %}
+            <a href="{{ post.url | relative_url }}" class="post-card">
+              {% if post.image %}
+                <img src="{{ post.image | relative_url }}" alt="{{ post.title }}" class="post-image">
+              {% endif %}
+              <div class="post-category category-{{ post.category | downcase }}">{{ post.category }}</div>
+              <h3 class="post-title">{{ post.title }}</h3>
+              <p class="post-excerpt">{{ post.excerpt | strip_html | truncate: 120 }}</p>
+              <span class="post-date">{{ post.date | date: "%b %d, %Y" }}</span>
+            </a>
+          {% endfor %}
+        </div>
+
+        <!-- Pagination -->
+        {% include blog-pagination.html %}
+      </div>
+    </div>
+  </div>
+</section>

data/_layouts/blog.html

@@ -0,0 +1,42 @@
+---
+layout: default
+---
+
+<section class="two-column">
+  <div class="left-section">
+    <div class="left-container">
+      <div class="image-wrapper">
+        <div class="hero-content">
+          {% include hero-carousel.html %}
+          <div class="logo-overlay">{% include logo.html %}</div>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <div class="right-section">
+    <div class="content-wrapper">
+      {% include navigation.html %}
+      <div class="content-area">
+        <h1>Blog</h1>
+        <p class="body-large" style="color: var(--howdy-text-secondary);">{{ page.description | default: "Thoughts, ideas, and inspiration." }}</p>
+
+        <div class="posts-grid" style="margin-top: 48px;">
+          {% for post in paginator.posts %}
+            <a href="{{ post.url | relative_url }}" class="post-card">
+              {% if post.image %}
+                <img src="{{ post.image | relative_url }}" alt="{{ post.title }}" class="post-image">
+              {% endif %}
+              <div class="post-category category-{{ post.category | downcase }}">{{ post.category }}</div>
+              <h3 class="post-title">{{ post.title }}</h3>
+              <p class="post-excerpt">{{ post.excerpt | strip_html | truncate: 120 }}</p>
+              <span class="post-date">{{ post.date | date: "%b %d, %Y" }}</span>
+            </a>
+          {% endfor %}
+        </div>
+
+        {% include blog-pagination.html %}
+      </div>
+    </div>
+  </div>
+</section>

data/_layouts/default.html

@@ -0,0 +1,86 @@
+<!DOCTYPE html>
+<html lang="{{ page.lang | default: site.lang | default: 'en' }}">
+<head>
+  {% include head.html %}
+</head>
+<body>
+  <div class="main-container">
+    {{ content }}
+  </div>
+
+
+  <script src="{{ '/assets/js/theme-toggle.js' | relative_url }}"></script>
+  <script src="{{ '/assets/js/mobile-nav.js' | relative_url }}"></script>
+  <script src="{{ '/assets/js/swiper-bundle.min.js' | relative_url }}"></script>
+  <script src="{{ '/assets/js/hero-carousel.js' | relative_url }}"></script>
+
+  <!-- Analytics -->
+  {% include analytics.html %}
+
+  <!-- Custom JS injection -->
+  {% if site.custom_js %}
+  <script src="{{ site.custom_js | relative_url }}"></script>
+  {% endif %}
+
+  <script>
+  // Smooth page transitions: fade out content only, then navigate
+  document.addEventListener('click', (e) => {
+    const link = e.target.closest('a');
+    if (!link) return;
+
+    const href = link.getAttribute('href');
+    if (!href || href.startsWith('#') || href.startsWith('mailto:') || href.startsWith('tel:') || link.target === '_blank') return;
+
+    const url = new URL(href, window.location.href);
+    if (url.origin === window.location.origin && url.pathname !== window.location.pathname) {
+      e.preventDefault();
+
+      if (typeof window.howdyNavIsClosing === 'function' && window.howdyNavIsClosing()) {
+        setTimeout(() => {
+          document.body.classList.add('howdy-navigating');
+          setTimeout(() => { window.location.href = href; }, 150);
+        }, 300);
+      } else {
+        document.body.classList.add('howdy-navigating');
+        setTimeout(() => { window.location.href = href; }, 150);
+      }
+    }
+  });
+  </script>
+
+  <script>
+  // Fix pagination links - add blog path prefix if missing
+  const blogPath = '{{ "/blog/" | relative_url }}';
+  document.querySelectorAll('.pagination a[href^="/page"]').forEach(link => {
+    if (!link.href.includes(blogPath)) {
+      link.href = blogPath + link.getAttribute('href').substring(1);
+    }
+  });
+  </script>
+
+  <script>
+  // TOC smooth scroll with offset and highlight
+  document.addEventListener('click', (e) => {
+    const link = e.target.closest('.toc a');
+    if (!link) return;
+
+    const href = link.getAttribute('href');
+    if (!href || !href.startsWith('#')) return;
+
+    const target = document.querySelector(href);
+    if (!target) return;
+
+    e.preventDefault();
+    target.scrollIntoView({ behavior: 'smooth', block: 'start' });
+
+    target.style.transition = 'color 0.3s ease';
+    target.style.color = 'var(--howdy-accent-green)';
+    setTimeout(() => {
+      target.style.color = '';
+    }, 1500);
+
+    window.history.pushState(null, null, href);
+  });
+  </script>
+</body>
+</html>

data/_layouts/home.html

@@ -0,0 +1,5 @@
+---
+layout: default
+---
+
+{{ content }}

data/_layouts/page.html

@@ -0,0 +1,33 @@
+---
+layout: default
+---
+
+<section class="two-column">
+  <div class="left-section">
+    <div class="left-container">
+      <div class="image-wrapper">
+        <div class="hero-content">
+          {% include hero-carousel.html %}
+          <div class="logo-overlay">{% include logo.html %}</div>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <div class="right-section">
+    <div class="content-wrapper">
+      {% include navigation.html %}
+      <div class="content-area">
+        <h1>{{ page.title }}</h1>
+
+        {% if page.subtitle %}
+          <p class="body-large" style="margin-top: 16px;">{{ page.subtitle }}</p>
+        {% endif %}
+
+        <div class="page-content" style="margin-top: 32px;">
+          {{ content }}
+        </div>
+      </div>
+    </div>
+  </div>
+</section>