From a2219ebd637f68c3b3985db3f40a497f2516abd0 Mon Sep 17 00:00:00 2001
From: andre <andre.filipe6@gmail.com>
Date: Tue, 13 Oct 2026 19:01:18 +0100
Subject: [PATCH] style(site): apply tuned grain from the lab (freq 1.98, 1
 octave, overlay on buttons, 155px tile)

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
---
 site/assets/css/style.css |  8 +++++---
 site/includes/include.php | 10 +++++-----
 2 files changed, 10 insertions(+), 8 deletions(-)

diff --git a/site/assets/css/style.css b/site/assets/css/style.css
index 547d031..b67c4d6 100644
--- a/site/assets/css/style.css
+++ b/site/assets/css/style.css
@@ -480,11 +480,12 @@ section[id] {
   z-index: -1;
   border: var(--ring) solid transparent;
   background:
-    var(--noise) 0 0 / 140px padding-box,
+    var(--noise) 0 0 / 155px 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,
         rgba(var(--fitme-accent-rgb), 0) 360deg) border-box;
+  background-blend-mode: overlay, normal, normal;
 }
 .site-btn::after, .gym-switch-btn::after {
   inset: calc(-1 * (var(--ring) + var(--elb)) - 2px);
@@ -4623,12 +4624,13 @@ a:where(:not(.site-btn, .gym-switch-btn, .gal-link, .skip-link, .splide__arrow,
    ::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='.16'/%3E%3C/svg%3E");
+  --noise: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='155' height='155'%3E%3Cfilter id='n' x='0' y='0' width='100%25' height='100%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.98' numOctaves='1' seed='7' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='1.87' intercept='-0.435'/%3E%3CfeFuncG type='linear' slope='1.87' intercept='-0.435'/%3E%3CfeFuncB type='linear' slope='1.87' intercept='-0.435'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.160'/%3E%3C/svg%3E");
 }
 .site-btn,
 .gym-switch-btn,
 .crossfit-nav-link {
   background-image: var(--noise) !important;
-  background-size: 140px 140px !important;
+  background-size: 155px 155px !important;
+  background-blend-mode: overlay !important;
 }
 h1, h2 { filter: url(#pt-noise); }
diff --git a/site/includes/include.php b/site/includes/include.php
index ea1c1fb..891e65a 100644
--- a/site/includes/include.php
+++ b/site/includes/include.php
@@ -91,14 +91,14 @@ $canonical = $GLOBALS['_canonical_override'] ?? match ($page) {
 <body>
 <svg width="0" height="0" style="position:absolute" aria-hidden="true" focusable="false">
   <!-- Grain for the h1/h2 lettering (style.css, "Noise texture"): fractal noise -> grey ->
-       squeezed to 86-100% brightness, multiplied into the glyphs and clipped to their shape. -->
+       squeezed to 88-100% brightness, multiplied into the glyphs and clipped to their shape. -->
   <filter id="pt-noise" x="0" y="0" width="100%" height="100%" color-interpolation-filters="sRGB">
-    <feTurbulence type="fractalNoise" baseFrequency=".9" numOctaves="2" seed="4" result="n"/>
+    <feTurbulence type="fractalNoise" baseFrequency="1.98" numOctaves="1" seed="7" result="n"/>
     <feColorMatrix in="n" type="saturate" values="0" result="g"/>
     <feComponentTransfer in="g" result="grain">
-      <feFuncR type="linear" slope=".15" intercept=".86"/>
-      <feFuncG type="linear" slope=".15" intercept=".86"/>
-      <feFuncB type="linear" slope=".15" intercept=".86"/>
+      <feFuncR type="linear" slope=".123" intercept=".877"/>
+      <feFuncG type="linear" slope=".123" intercept=".877"/>
+      <feFuncB type="linear" slope=".123" intercept=".877"/>
       <feFuncA type="linear" slope="0" intercept="1"/>
     </feComponentTransfer>
     <feBlend in="SourceGraphic" in2="grain" mode="multiply" result="mix"/>