fix: apply recent accessibility and layout changes

components/awaria/AwariaClient.tsx

@@ -168,11 +168,11 @@ export function AwariaClient() {
               <Phone className="size-4" /> {companyDetails.phone}
             </button>
           </a>
-          <Link href="/">
-            <button className="text-sm text-text-muted hover:text-accent transition-colors">
+          <Link href="/" className="text-sm text-text-muted hover:text-accent transition-colors">
+
               Wróć na stronę główną
-            </button>
-          </Link>
+            
+</Link>
         </div>
       </main>
     );

components/kalkulator/KalkulatorClient.tsx

@@ -949,11 +949,11 @@ export function KalkulatorClient({ products }: Props) {
                       <Phone className="size-3.5" /> Bezpłatna wycena
                     </button>
                   </a>
-                  <Link href="/kontakt">
-                    <button className="flex items-center gap-2 px-4 py-2 bg-amber-100 text-amber-800 rounded-xl text-xs font-bold hover:bg-amber-200 transition-colors border border-amber-300">
+                  <Link href="/kontakt" className="flex items-center gap-2 px-4 py-2 bg-amber-100 text-amber-800 rounded-xl text-xs font-bold hover:bg-amber-200 transition-colors border border-amber-300">
+
                       Prześlij zdjęcia
-                    </button>
-                  </Link>
+                    
+</Link>
                 </div>
               </div>
             </div>
@@ -976,11 +976,11 @@ export function KalkulatorClient({ products }: Props) {
                 </button>
               )
             ) : (
-              <Link href="/sklep">
-                <button className="flex items-center gap-2 px-6 py-2.5 bg-accent text-white rounded-xl text-sm font-bold hover:bg-accent/90 transition-colors">
+              <Link href="/sklep" className="flex items-center gap-2 px-6 py-2.5 bg-accent text-white rounded-xl text-sm font-bold hover:bg-accent/90 transition-colors">
+
                   Przejdź do sklepu <ArrowRight className="size-4" />
-                </button>
-              </Link>
+                
+</Link>
             )}
           </div>
         </div>

components/layout/Header.tsx

@@ -240,17 +240,17 @@ export function Header() {
 
           {/* CTA Button */}
           <div className="hidden lg:flex items-center gap-3">
-            <Link href="/zgloszenie-awarii">
-              <button className="flex items-center gap-1.5 px-4 py-2 bg-red-500 text-white rounded-[var(--radius-field)] font-bold text-sm hover:bg-red-600 transition-colors whitespace-nowrap">
+            <Link href="/zgloszenie-awarii" className="flex items-center gap-1.5 px-4 py-2 bg-red-500 text-white rounded-[var(--radius-field)] font-bold text-sm hover:bg-red-600 transition-colors whitespace-nowrap">
+
                 <Wrench className="size-4" />
                 Zgłoś awarię
-              </button>
-            </Link>
-            <Link href="/kontakt">
-              <button className="btn btn-primary font-bold">
+              
+</Link>
+            <Link href="/kontakt" className="btn btn-primary font-bold">
+
                 Darmowa wycena
-              </button>
-            </Link>
+              
+</Link>
           </div>
         </div>
       </header>

components/layout/MobileMenu.tsx

@@ -41,7 +41,7 @@ export function MobileMenu({ isOpen, onClose }: MobileMenuProps) {
     { label: 'Serwis Mitsubishi Electric', href: '/serwis-mitsubishi' },
     { label: 'Serwis LG', href: '/serwis-lg' },
     { label: 'Klimatyzacja do domu', href: '/klimatyzacja-do-domu' },
-    /* { label: 'Klimatyzacja do biura', href: '/klimatyzacja-do-biura' }, */
+    { label: 'Klimatyzacja do biura', href: '/klimatyzacja-do-biura' },
   ];
 
 
@@ -248,11 +248,11 @@ export function MobileMenu({ isOpen, onClose }: MobileMenuProps) {
             <Phone className="size-4 text-accent" />
             <span>Zadzwoń: {companyDetails.phone}</span>
           </a>
-          <Link href="/kontakt" onClick={onClose}>
-            <button className="btn btn-primary w-full font-bold">
+          <Link href="/kontakt" onClick={onClose} className="btn btn-primary w-full font-bold">
+
               Darmowa konsultacja
-            </button>
-          </Link>
+            
+</Link>
         </div>
       </div>
     </div>

components/layout/TrustBar.tsx

@@ -39,9 +39,9 @@ export function TrustBar() {
                   <Icon className="size-6" />
                 </div>
                 <div>
-                  <h4 className="text-sm font-semibold text-primary font-heading">
+                  <h3 className="text-sm font-semibold text-primary font-heading">
                     {item.title}
-                  </h4>
+                  </h3>
                   <p className="text-xs text-text-muted mt-0.5">
                     {item.description}
                   </p>

components/sections/AboutStory.tsx

@@ -22,7 +22,7 @@ export function AboutStory() {
           <div className="absolute -bottom-8 -right-8 bg-white p-6 rounded-2xl shadow-xl hidden md:block">
             <div className="flex items-center gap-4">
               <div className="flex-shrink-0 w-16 h-16 bg-accent/10 rounded-full flex items-center justify-center">
-                <span className="text-2xl font-black text-accent font-heading">
+                <span className="text-2xl font-extrabold text-accent font-heading">
                   {companyDetails.stats.find(s => s.label.includes("doświadczenia"))?.value || "15+"}
                 </span>
               </div>

components/sections/BlogPreview.tsx

@@ -92,12 +92,12 @@ export function BlogPreview() {
 
         {/* Blog Catalog Button */}
         <div className="flex justify-center mt-12">
-          <Link href="/blog">
-            <button className="btn btn-outline btn-primary bg-white font-bold flex items-center gap-2 group">
+          <Link href="/blog" className="btn btn-outline btn-primary bg-white font-bold flex items-center gap-2 group">
+
               <span>Przejdź do bloga</span>
               <ArrowRight className="size-4 group-hover:translate-x-1 transition-transform" />
-            </button>
-          </Link>
+            
+</Link>
         </div>
       </div>
     </section>

components/sections/CtaBanner.tsx

@@ -60,12 +60,12 @@ export function CtaBanner({
 
           {/* Action buttons */}
           <div className="flex flex-col sm:flex-row items-center gap-4 mt-8 w-full sm:w-auto shrink-0">
-            <Link href={ctaLink} className="w-full sm:w-auto">
-              <button className="btn btn-primary w-full sm:w-auto font-bold text-white">
+            <Link href={ctaLink} className="w-full sm:w-auto btn btn-primary font-bold text-white">
+
                 <span>{ctaText}</span>
                 <ArrowRight className="size-5" />
-              </button>
-            </Link>
+              
+</Link>
 
             <a
               href={`tel:${companyDetails.phoneRaw}`}

components/sections/FeaturedProducts.tsx

@@ -26,12 +26,12 @@ export function FeaturedProducts() {
 
         {/* Catalog Link */}
         <div className="flex justify-center mt-12">
-          <Link href="/sklep">
-            <button className="btn btn-outline btn-primary bg-white font-bold flex items-center gap-2 group">
+          <Link href="/sklep" className="btn btn-outline btn-primary bg-white font-bold flex items-center gap-2 group">
+
               <span>Zobacz cały sklep</span>
               <ArrowRight className="size-4 group-hover:translate-x-1 transition-transform" />
-            </button>
-          </Link>
+            
+</Link>
         </div>
       </div>
     </section>

components/sections/HeroSection.tsx

@@ -80,12 +80,12 @@ export function HeroSection({
           {/* CTA Buttons */}
           <div className="mt-10 flex flex-col sm:flex-row items-center gap-4 w-full sm:w-auto">
             {ctaText && ctaLink && (
-              <Link href={ctaLink} className="w-full sm:w-auto group">
-                <button className="btn btn-primary text-white font-bold w-full sm:w-auto">
+              <Link href={ctaLink} className="w-full sm:w-auto group btn btn-primary text-white font-bold">
+
                   <span>{ctaText}</span>
                   <ArrowRight className="size-5 group-hover:translate-x-1 transition-transform" />
-                </button>
-              </Link>
+                
+</Link>
             )}
 
           </div>

components/sections/HomeServices.tsx

@@ -132,11 +132,11 @@ export function HomeServices() {
                  <p className="text-sm text-text-muted leading-relaxed">Nasi certyfikowani technicy są dostępni od poniedziałku do soboty. Zarezerwuj termin już dziś, aby uniknąć kolejek w sezonie.</p>
                </div>
                <div className="flex flex-col sm:flex-row items-stretch sm:items-center gap-4 shrink-0 w-full lg:w-auto">
-                 <Link href="/kontakt" className="w-full sm:w-auto">
-                   <button className="w-full sm:w-auto flex justify-center items-center gap-2 px-6 py-3.5 bg-accent text-white font-bold text-sm hover:bg-accent/90 transition-colors rounded-xl">
+                 <Link href="/kontakt" className="w-full sm:w-auto flex justify-center items-center gap-2 px-6 py-3.5 bg-accent text-white font-bold text-sm hover:bg-accent/90 transition-colors rounded-xl">
+
                      Umów serwis <Calendar className="size-4" />
-                   </button>
-                 </Link>
+                   
+</Link>
                  <a href={`tel:${companyDetails.phoneRaw}`} className="w-full sm:w-auto">
                    <button className="w-full sm:w-auto flex justify-center items-center gap-2 px-6 py-3.5 bg-white text-primary border border-border font-bold text-sm hover:bg-slate-50 transition-colors rounded-xl">
                      <Phone className="size-4" /> Zadzwoń do nas

components/sections/PillarsSection.tsx

@@ -24,12 +24,12 @@ export function PillarsSection() {
             </div>
 
             <div>
-              <Link href="/klimatyzacja">
-                <button className="btn btn-primary text-white flex items-center gap-2">
+              <Link href="/klimatyzacja" className="btn btn-primary text-white flex items-center gap-2">
+
                   <span>Przejdź do oferty HVAC</span>
                   <ChevronRight className="size-5 group-hover:translate-x-1 transition-transform" />
-                </button>
-              </Link>
+                
+</Link>
             </div>
           </div>
 
@@ -51,12 +51,12 @@ export function PillarsSection() {
             </div>
 
             <div className="mt-12 text-center">
-              <Link href="/uslugi-domowe">
-                <button className="btn btn-outline btn-primary bg-white font-bold flex items-center gap-2 mx-auto group">
+              <Link href="/uslugi-domowe" className="btn btn-outline btn-primary bg-white font-bold flex items-center gap-2 mx-auto group">
+
                   <span>Pełna oferta usług</span>
                   <ArrowRight className="size-4 group-hover:translate-x-1 transition-transform" />
-                </button>
-              </Link>
+                
+</Link>
             </div>
           </div>
         </div>

components/sections/Testimonials.tsx

@@ -43,11 +43,11 @@ export function Testimonials() {
             <p className="text-text-muted mt-1">Opinie klientów</p>
           </div>
           <div className="flex gap-2">
-            <button onClick={scrollPrev}
+            <button onClick={scrollPrev} aria-label="Poprzednia opinia"
               className="size-10 rounded-xl border border-border bg-white flex items-center justify-center text-primary hover:border-accent hover:text-accent transition-colors">
               <ChevronLeft className="size-5" />
             </button>
-            <button onClick={scrollNext}
+            <button onClick={scrollNext} aria-label="Następna opinia"
               className="size-10 rounded-xl border border-border bg-white flex items-center justify-center text-primary hover:border-accent hover:text-accent transition-colors">
               <ChevronRight className="size-5" />
             </button>

components/shop/CartSummary.tsx

@@ -58,12 +58,12 @@ export function CartSummary() {
       </div>
 
       {/* Przycisk */}
-      <Link href="/zamowienie" className="block w-full">
-        <button className="btn btn-primary w-full font-bold group cursor-pointer text-white">
+      <Link href="/zamowienie" className="block w-full btn btn-primary font-bold group cursor-pointer text-white">
+
           Przejdź do zamówienia
           <ArrowRight className="w-5 h-5 ml-2 group-hover:translate-x-1 transition-transform" />
-        </button>
-      </Link>
+        
+</Link>
 
       {/* Zaufanie */}
       <div className="mt-6 flex flex-col gap-3">

components/shop/CompareBar.tsx

@@ -47,11 +47,11 @@ export function CompareBar() {
 
           <div className="flex items-center gap-2 shrink-0">
             {items.length >= 2 && (
-              <Link href="/porownaj">
-                <button className="btn btn-primary text-white font-bold text-sm py-2 px-4">
+              <Link href="/porownaj" className="btn btn-primary text-white font-bold text-sm py-2 px-4">
+
                   Porównaj
-                </button>
-              </Link>
+                
+</Link>
             )}
             <button onClick={clearAll} className="text-xs text-text-muted hover:text-primary transition-colors">
               Wyczyść

components/shop/ProductPageClient.tsx

@@ -311,17 +311,17 @@ export function ProductPageClient({ product, seriesProducts, companyPhone, compa
                       </button>
                     )}
                     {cartState === 'cart' && (
-                      <Link href="/koszyk" className="flex-1">
-                        <button className="w-full flex items-center justify-center gap-2 py-2.5 px-4 rounded-xl font-bold text-sm bg-green-500 text-white hover:bg-green-600 transition-colors">
+                      <Link href="/koszyk" className="flex-1 w-full flex items-center justify-center gap-2 py-2.5 px-4 rounded-xl font-bold text-sm bg-green-500 text-white hover:bg-green-600 transition-colors">
+
                           <ShoppingCart className="size-4" /> Zobacz koszyk
-                        </button>
-                      </Link>
+                        
+</Link>
                     )}
-                    <Link href="/kontakt" className="flex-1">
-                      <button className="w-full flex items-center justify-center gap-2 py-2.5 px-4 rounded-xl font-bold text-sm border-2 border-primary text-primary hover:bg-primary hover:text-white transition-all">
+                    <Link href="/kontakt" className="flex-1 w-full flex items-center justify-center gap-2 py-2.5 px-4 rounded-xl font-bold text-sm border-2 border-primary text-primary hover:bg-primary hover:text-white transition-all">
+
                         Zapytaj o montaż
-                      </button>
-                    </Link>
+                      
+</Link>
                   </div>
 
                   <button

components/shop/ProductsGrid.tsx

@@ -438,11 +438,11 @@ export function ProductsGrid({ products, brands }: ProductsGridProps) {
           {companyDetails.phone}
         </a>
         <p className="text-xs text-text-muted mt-1">{companyDetails.hours}</p>
-        <Link href="/kontakt">
-          <button className="mt-3 w-full btn btn-primary text-white font-bold text-sm py-2">
+        <Link href="/kontakt" className="mt-3 w-full btn btn-primary text-white font-bold text-sm py-2">
+
             Zadaj pytanie
-          </button>
-        </Link>
+          
+</Link>
       </div>
     </aside>
   );