From a24c239ae1a0185dda645b085de045e82b3f903b Mon Sep 17 00:00:00 2001
From: MichalC <103170279+wSBMichalee@users.noreply.github.com>
Date: Tue, 1 Sep 2026 23:54:31 +0200
Subject: [PATCH] style: standardize typography scale (H1-H3), update eyebrow
 labels to mono, and unify CTA padding

---
 src/blocks/Affiliation/Component.tsx      |  2 +-
 src/blocks/Eligibility/Component.tsx      | 13 ++++++-------
 src/blocks/FAQTeaser/Component.tsx        |  4 ++--
 src/blocks/FinalCTA/Component.tsx         |  2 +-
 src/blocks/Hero/Component.tsx             |  6 +++---
 src/blocks/PageHeader/Component.tsx       |  2 +-
 src/blocks/Process/Component.tsx          |  4 ++--
 src/blocks/ServicesDetailed/Component.tsx |  7 +++++--
 src/blocks/ServicesList/Component.tsx     |  4 ++--
 src/blocks/Stats/Component.tsx            |  2 +-
 src/blocks/UniqueValue/Component.tsx      |  2 +-
 11 files changed, 25 insertions(+), 23 deletions(-)

diff --git a/src/blocks/Affiliation/Component.tsx b/src/blocks/Affiliation/Component.tsx
index 545f8e2..b074817 100644
--- a/src/blocks/Affiliation/Component.tsx
+++ b/src/blocks/Affiliation/Component.tsx
@@ -15,7 +15,7 @@ export const AffiliationBlock: React.FC<Props> = ({ title, description, logo, li
             <div className="font-mono text-sm md:text-base font-bold text-accent tracking-widest uppercase mb-4">
               // Zaufanie
             </div>
-            <h2 className="font-heading text-4xl sm:text-5xl md:text-6xl font-extrabold tracking-tight text-foreground mb-6 text-balance">
+            <h2 className="font-heading text-3xl sm:text-4xl md:text-5xl font-extrabold tracking-tight text-foreground mb-6 text-balance">
               {title}
             </h2>
             <p className="text-foreground/75 text-lg md:text-xl font-light leading-relaxed mb-12 max-w-xl">
diff --git a/src/blocks/Eligibility/Component.tsx b/src/blocks/Eligibility/Component.tsx
index dd7fca1..a41e96d 100644
--- a/src/blocks/Eligibility/Component.tsx
+++ b/src/blocks/Eligibility/Component.tsx
@@ -28,11 +28,10 @@ export const EligibilityBlock: React.FC<EligibilityProps> = ({
     <section className="py-12 md:py-20 bg-card/60 border-y border-border">
       <div className="container-premium">
         <div className="max-w-3xl mb-12 text-center md:text-left">
-          <div className="inline-flex items-center gap-2 px-3 py-1.5 rounded-full bg-accent/10 text-accent text-xs font-semibold uppercase tracking-wider mb-4">
-            <ShieldAlert size={16} />
-            <span>Zakres uprawnień doradczych</span>
+          <div className="font-mono text-sm md:text-base font-bold text-accent tracking-widest uppercase mb-4">
+            // Zakres uprawnień doradczych
           </div>
-          <h2 className="font-heading text-2xl sm:text-3xl md:text-4xl font-bold text-foreground tracking-tight">
+          <h2 className="font-heading text-3xl sm:text-4xl md:text-5xl font-extrabold text-foreground tracking-tight">
             {title}
           </h2>
           {subtitle && (
@@ -49,7 +48,7 @@ export const EligibilityBlock: React.FC<EligibilityProps> = ({
               <div className="w-10 h-10 rounded-xl bg-accent/10 text-accent flex items-center justify-center shrink-0">
                 <CheckCircle2 size={24} />
               </div>
-              <h3 className="font-heading text-xl font-bold text-foreground">
+              <h3 className="font-heading text-xl sm:text-2xl font-bold text-foreground">
                 {eligibleTitle}
               </h3>
             </div>
@@ -77,7 +76,7 @@ export const EligibilityBlock: React.FC<EligibilityProps> = ({
                 <div className="w-10 h-10 rounded-xl bg-amber-500/10 text-amber-500 flex items-center justify-center shrink-0">
                   <AlertTriangle size={22} />
                 </div>
-                <h3 className="font-heading text-lg font-bold text-foreground">
+                <h3 className="font-heading text-xl sm:text-2xl font-bold text-foreground">
                   {limitationsTitle}
                 </h3>
               </div>
@@ -93,7 +92,7 @@ export const EligibilityBlock: React.FC<EligibilityProps> = ({
                 <div className="w-10 h-10 rounded-xl bg-red-500/15 text-red-600 flex items-center justify-center shrink-0">
                   <XCircle size={22} />
                 </div>
-                <h3 className="font-heading text-lg font-bold text-red-950 dark:text-red-200">
+                <h3 className="font-heading text-xl sm:text-2xl font-bold text-red-950 dark:text-red-200">
                   {excludedTitle}
                 </h3>
               </div>
diff --git a/src/blocks/FAQTeaser/Component.tsx b/src/blocks/FAQTeaser/Component.tsx
index c9bbb41..7be1a37 100644
--- a/src/blocks/FAQTeaser/Component.tsx
+++ b/src/blocks/FAQTeaser/Component.tsx
@@ -14,7 +14,7 @@ export const FAQTeaserBlock: React.FC<Props> = ({ title, questions, linkText })
           <div className="font-mono text-sm md:text-base font-bold text-accent tracking-widest uppercase mb-4">
             // FAQ
           </div>
-          <h2 className="font-heading text-4xl sm:text-5xl md:text-6xl font-extrabold text-foreground tracking-tight text-balance">
+          <h2 className="font-heading text-3xl sm:text-4xl md:text-5xl font-extrabold text-foreground tracking-tight text-balance">
             {title}
           </h2>
         </div>
@@ -25,7 +25,7 @@ export const FAQTeaserBlock: React.FC<Props> = ({ title, questions, linkText })
               key={q.id || index}
               className="py-6 border-b border-border/50 first:border-t"
             >
-              <h3 className="font-heading text-xl font-bold text-foreground mb-3">{q.question}</h3>
+              <h3 className="font-heading text-xl sm:text-2xl font-bold text-foreground mb-3">{q.question}</h3>
               <p className="text-foreground/75 leading-relaxed">{q.answer}</p>
             </div>
           ))}
diff --git a/src/blocks/FinalCTA/Component.tsx b/src/blocks/FinalCTA/Component.tsx
index 14ffb35..f95c615 100644
--- a/src/blocks/FinalCTA/Component.tsx
+++ b/src/blocks/FinalCTA/Component.tsx
@@ -14,7 +14,7 @@ export const FinalCTABlock: React.FC<Props> = ({ title, subtitle, buttonText })
             // Kontakt
           </div>
 
-          <h2 className="font-heading text-4xl sm:text-5xl md:text-6xl font-extrabold text-foreground tracking-tight mb-6 text-balance">
+          <h2 className="font-heading text-3xl sm:text-4xl md:text-5xl font-extrabold text-foreground tracking-tight mb-6 text-balance">
             {title}
           </h2>
 
diff --git a/src/blocks/Hero/Component.tsx b/src/blocks/Hero/Component.tsx
index e42b009..e6f656d 100644
--- a/src/blocks/Hero/Component.tsx
+++ b/src/blocks/Hero/Component.tsx
@@ -63,8 +63,8 @@ export const HeroBlock: React.FC<Props> = ({ title, subtitle, primaryCta, second
       <div className="container-premium relative z-10">
         <div className="max-w-4xl">
           {yearsOfExperience && (
-            <div className="text-accent/90 text-sm md:text-base font-bold tracking-[0.2em] uppercase mb-8">
-              {yearsOfExperience}
+            <div className="font-mono text-sm md:text-base font-bold text-accent tracking-widest uppercase mb-4">
+              // {yearsOfExperience}
             </div>
           )}
 
@@ -81,7 +81,7 @@ export const HeroBlock: React.FC<Props> = ({ title, subtitle, primaryCta, second
               href={process.env.NEXT_PUBLIC_WHATSAPP_LINK || '#'}
               target="_blank"
               rel="noopener noreferrer"
-              className="px-10 py-5 bg-accent hover:bg-accent/90 text-background font-bold text-lg transition-colors flex items-center justify-center rounded-[var(--radius-button)]"
+              className="px-8 py-4 bg-accent hover:bg-accent/90 text-background font-bold text-base sm:text-lg transition-colors flex items-center justify-center rounded-[var(--radius-button)]"
             >
               {primaryCta}
             </a>
diff --git a/src/blocks/PageHeader/Component.tsx b/src/blocks/PageHeader/Component.tsx
index b06ac1a..b1548a1 100644
--- a/src/blocks/PageHeader/Component.tsx
+++ b/src/blocks/PageHeader/Component.tsx
@@ -9,7 +9,7 @@ export const PageHeaderBlock: React.FC<PageHeaderProps> = ({ title, subtitle })
   return (
     <section className="bg-card border-b border-border py-16 md:py-20 mb-12">
       <div className="container-premium text-center max-w-4xl mx-auto">
-        <h1 className="font-heading text-3xl sm:text-4xl md:text-5xl font-extrabold text-foreground tracking-tight leading-tight">
+        <h1 className="font-heading text-4xl sm:text-5xl md:text-6xl lg:text-7xl font-extrabold text-foreground tracking-tight leading-tight text-balance">
           {title}
         </h1>
         {subtitle && (
diff --git a/src/blocks/Process/Component.tsx b/src/blocks/Process/Component.tsx
index 0fc4063..f175517 100644
--- a/src/blocks/Process/Component.tsx
+++ b/src/blocks/Process/Component.tsx
@@ -14,7 +14,7 @@ export const ProcessBlock: React.FC<Props> = ({ title, steps, ctaText }) => {
           <div className="font-mono text-sm md:text-base font-bold text-accent tracking-widest uppercase mb-4">
             // Proces
           </div>
-          <h2 className="font-heading text-4xl sm:text-5xl md:text-6xl font-extrabold tracking-tight text-foreground mb-6 text-balance">
+          <h2 className="font-heading text-3xl sm:text-4xl md:text-5xl font-extrabold tracking-tight text-foreground mb-6 text-balance">
             {title}
           </h2>
           <p className="text-foreground/75 text-lg md:text-xl font-light leading-relaxed">
@@ -36,7 +36,7 @@ export const ProcessBlock: React.FC<Props> = ({ title, steps, ctaText }) => {
                     {stepNumber}
                   </div>
                   <div className="relative z-10 pt-2 border-t-2 border-transparent group-hover:border-accent transition-colors flex-1">
-                    <h3 className="font-heading text-2xl md:text-3xl font-bold text-foreground mb-4">
+                    <h3 className="font-heading text-xl sm:text-2xl font-bold text-foreground mb-4">
                       {step.title}
                     </h3>
                     <p className="text-foreground/75 text-lg font-light leading-relaxed">
diff --git a/src/blocks/ServicesDetailed/Component.tsx b/src/blocks/ServicesDetailed/Component.tsx
index 2b70203..9200f21 100644
--- a/src/blocks/ServicesDetailed/Component.tsx
+++ b/src/blocks/ServicesDetailed/Component.tsx
@@ -40,7 +40,10 @@ export const ServicesDetailedBlock: React.FC<ServicesDetailedProps> = ({
     <section className="py-12 md:py-16">
       <div className="container-premium">
         <div className="max-w-3xl mb-12">
-          <h2 className="font-heading text-2xl sm:text-3xl md:text-4xl font-bold text-foreground tracking-tight">
+          <div className="font-mono text-sm md:text-base font-bold text-accent tracking-widest uppercase mb-4">
+            // Usługi
+          </div>
+          <h2 className="font-heading text-3xl sm:text-4xl md:text-5xl font-extrabold text-foreground tracking-tight text-balance">
             {title}
           </h2>
           {subtitle && (
@@ -63,7 +66,7 @@ export const ServicesDetailedBlock: React.FC<ServicesDetailedProps> = ({
                   <div className="w-12 h-12 rounded-xl bg-accent/10 text-accent flex items-center justify-center mb-6">
                     <Icon size={24} />
                   </div>
-                  <h3 className="font-heading text-xl font-bold text-foreground mb-3 leading-snug">
+                  <h3 className="font-heading text-xl sm:text-2xl font-bold text-foreground mb-3 leading-snug">
                     {service.title}
                   </h3>
                   <p className="text-foreground/75 text-sm sm:text-base leading-relaxed">
diff --git a/src/blocks/ServicesList/Component.tsx b/src/blocks/ServicesList/Component.tsx
index 2bc3074..75f06a6 100644
--- a/src/blocks/ServicesList/Component.tsx
+++ b/src/blocks/ServicesList/Component.tsx
@@ -14,7 +14,7 @@ export const ServicesListBlock: React.FC<Props> = ({ title, services }) => {
           <div className="font-mono text-sm md:text-base font-bold text-accent tracking-widest uppercase mb-4">
             // Usługi
           </div>
-          <h2 className="font-heading text-4xl sm:text-5xl md:text-6xl font-extrabold text-foreground tracking-tight max-w-2xl text-balance">
+          <h2 className="font-heading text-3xl sm:text-4xl md:text-5xl font-extrabold text-foreground tracking-tight max-w-2xl text-balance">
             {title}
           </h2>
         </div>
@@ -26,7 +26,7 @@ export const ServicesListBlock: React.FC<Props> = ({ title, services }) => {
               className="group border-b border-border py-8 md:py-12 flex flex-col md:flex-row gap-6 md:gap-12 lg:gap-24 items-start md:items-center hover:bg-foreground/[0.02] transition-colors"
             >
               <div className="md:w-1/3 shrink-0">
-                <h3 className="font-heading text-2xl md:text-3xl font-bold text-foreground group-hover:text-accent transition-colors">
+                <h3 className="font-heading text-xl sm:text-2xl font-bold text-foreground group-hover:text-accent transition-colors">
                   {service.title}
                 </h3>
               </div>
diff --git a/src/blocks/Stats/Component.tsx b/src/blocks/Stats/Component.tsx
index 9d9937a..6dcb705 100644
--- a/src/blocks/Stats/Component.tsx
+++ b/src/blocks/Stats/Component.tsx
@@ -24,7 +24,7 @@ export const StatsBlock: React.FC<StatsProps> = ({ title, subtitle, items }) =>
               // Statystyki
             </div>
             {title && (
-              <h2 className="font-heading text-4xl sm:text-5xl md:text-6xl font-extrabold text-foreground mb-6 tracking-tight text-balance">
+              <h2 className="font-heading text-3xl sm:text-4xl md:text-5xl font-extrabold text-foreground mb-6 tracking-tight text-balance">
                 {title}
               </h2>
             )}
diff --git a/src/blocks/UniqueValue/Component.tsx b/src/blocks/UniqueValue/Component.tsx
index 0c7eeb9..38481f1 100644
--- a/src/blocks/UniqueValue/Component.tsx
+++ b/src/blocks/UniqueValue/Component.tsx
@@ -31,7 +31,7 @@ export const UniqueValueBlock: React.FC<Props> = ({ title, description }) => {
               // Wartość
             </div>
 
-            <h2 className="font-heading text-4xl sm:text-5xl md:text-6xl font-extrabold text-foreground tracking-tight mb-6 text-balance">
+            <h2 className="font-heading text-3xl sm:text-4xl md:text-5xl font-extrabold text-foreground tracking-tight mb-6 text-balance">
               {title}
             </h2>