style(site): noise texture on buttons and h1/h2 lettering

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

site/assets/css/style.css

@@ -480,6 +480,7 @@ section[id] {
   z-index: -1;
   border: var(--ring) solid transparent;
   background:
+    var(--noise) 0 0 / 140px padding-box,
     linear-gradient(var(--btn-face), var(--btn-face)) padding-box,
     conic-gradient(from var(--pc-a), rgba(var(--fitme-accent-rgb), 0) 0deg, rgba(var(--fitme-accent-rgb), 0) 150deg,
         var(--fitme-accent) 250deg, #f4ff9c 300deg, var(--fitme-accent) 330deg,
@@ -4615,3 +4616,19 @@ a:where(:not(.site-btn, .gym-switch-btn, .gal-link, .skip-link, .splide__arrow,
 @media (prefers-reduced-motion: reduce) {
   a { transition: none !important; }
 }
+
+/* ── Noise texture ─────────────────────────────────────────────────────────────
+   Buttons: a tiled grey fractal-noise image laid over the face colour (!important
+   so the hover rules, which reset `background`, don't drop it; the hover face in
+   ::before carries the same layer). Headings: the #pt-noise SVG filter (defined
+   in site/includes/include.php) multiplies grain into the lettering only. */
+:root {
+  --noise: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n' x='0' y='0' width='100%25' height='100%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.22'/%3E%3C/svg%3E");
+}
+.site-btn,
+.gym-switch-btn,
+.crossfit-nav-link {
+  background-image: var(--noise) !important;
+  background-size: 140px 140px !important;
+}
+h1, h2 { filter: url(#pt-noise); }