feat: add custom Bootstrap styling with SCSS support

Implement SCSS-based custom styling system to enable Bootstrap customization while maintaining CDN delivery for core framework.

Changes:
- Add Hugo Pipes SCSS processing pipeline using css.Sass
- Create modular SCSS file structure (main.scss, _variables.scss, _custom.scss)
- Implement custom typography (base font size 1.25rem, adjusted heading sizes)
- Add custom link colors (#0b0089 primary, #0052a3 hover)
- Configure CSS minification and SHA-384 fingerprinting for cache busting
- Add comprehensive SCSS styling documentation

Technical details:
- Updated baseof.html to compile SCSS with Hugo Pipes
- CSS loads after Bootstrap CDN for proper cascade
- Minified output (~154 bytes)
- Supports live reload in development mode

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

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

assets/scss/_custom.scss

@@ -0,0 +1,14 @@
+// Custom Component Styles
+// Add custom styles that extend or modify Bootstrap components
+
+// Example: Custom navbar styling
+// .navbar-brand {
+//   font-weight: 700;
+// }
+
+// Example: Custom card styling
+// .card {
+//   border-radius: 8px;
+// }
+
+// Add your custom styles here

assets/scss/_variables.scss

@@ -0,0 +1,57 @@
+// Bootstrap Variable Overrides
+// These variables override Bootstrap's default design tokens
+// They are applied via CSS custom properties and utility classes
+
+// Typography - Base Font Size
+// This is the root font size that Bootstrap uses for all rem calculations
+// Default: 1rem (typically 16px in browsers)
+$font-size-base: 1.25rem;
+
+// You can also set it to a specific pixel value:
+// $font-size-base: 18px;  // Makes everything slightly larger
+
+body {
+  font-size: $font-size-base;
+}
+
+// Typography - Heading Font Sizes
+// Customize heading sizes to establish visual hierarchy
+$h1-font-size: 2rem;   // Default: 2.5rem
+$h2-font-size: 1.75rem;     // Default: 2rem
+$h3-font-size: 1.5rem;  // Default: 1.75rem
+$h4-font-size: 1.25rem;   // Default: 1.5rem
+$h5-font-size: 1rem;  // Default: 1.25rem
+$h6-font-size: 1rem;     // Default: 1rem
+
+// Apply heading sizes using CSS
+h1 { font-size: $h1-font-size; }
+h2 { font-size: $h2-font-size; }
+h3 { font-size: $h3-font-size; }
+h4 { font-size: $h4-font-size; }
+h5 { font-size: $h5-font-size; }
+h6 { font-size: $h6-font-size; }
+
+// Link Colors
+// Customize link colors for brand consistency
+$link-color: #0b0089;           // Default Bootstrap: #0d6efd
+$link-hover-color: #0052a3;     // Darker shade for hover state
+
+a {
+  color: $link-color;
+
+  &:hover {
+    color: $link-hover-color;
+  }
+}
+
+// Spacing
+// Uncomment and customize spacing scale if needed
+// $spacer: 1rem;
+// $spacers: (
+//   0: 0,
+//   1: $spacer * 0.25,
+//   2: $spacer * 0.5,
+//   3: $spacer,
+//   4: $spacer * 1.5,
+//   5: $spacer * 3,
+// );

assets/scss/main.scss

@@ -0,0 +1,8 @@
+// Main SCSS entry point for custom Bootstrap styling
+// This file is processed by Hugo Pipes and loaded after Bootstrap CDN CSS
+
+// Import Bootstrap variable overrides
+@import 'variables';
+
+// Import custom component styles
+@import 'custom';