feat: pill telefon → Ara butonu + hizmet detay zengin sidebar + unique hero

1) Header pill mode:
   - Pill aktifken telefon link gizlenir
   - Yerine kompakt 'Ara' butonu görünür (data-pill-show='true')
   - header-scroll.tsx hem hide hem show class'larını yönetiyor

2) Hizmet detay sayfası — yeni unique hero (ServiceHero component):
   - Gradient gradient icon (sky → purple, glow ile)
   - Profesyonel hizmet badge'i
   - Gradient text başlık
   - 4 'quick trust' satırı (teslim, destek, ücretsiz taslak, yerel)
   - 3 CTA: Teklif al (navy) / WhatsApp (yeşil) / Telefon ara
   - Sağda: hero_image varsa görsel + 'Şimdi başla' floating badge
   - Yoksa: dekoratif dark card + animasyonlu nokta deseni + glow +
     floating '100% Memnuniyet' ve '150+ Proje' kartları

3) Hizmet detay sayfası — sidebar (ServiceSidebar component):
   - QuickLeadForm (ad + telefon)
   - Gradient CTA card (telefon + WhatsApp butonları)
   - 'Risk almazsınız' garanti mini card
   - Diğer hizmetler tam listesi (icon + isim, hover'da gradient)
   - Site analizi lead magnet kartı

   Önceki versiyonda sadece 1 boş CTA + 1 boş diğer hizmetler vardı —
   artık doluyu doluya sidebar.

4) Layout: lg:grid-cols-[2fr_1fr] → lg:grid-cols-[1.5fr_1fr]
   - Sidebar daha geniş, içerik orantılı dağıldı

components/header-scroll.tsx

@@ -29,10 +29,13 @@ export function HeaderScrollEffect() {
       if (!mobile && pillWrap && header && navBar && wrap) {
         wrap.style.transform = "";
         wrap.style.opacity = "";
-        // Pill modu için data-pill-hide elementlerini gizle/göster
+        // Pill mode toggle: data-pill-hide gizlenir, data-pill-show görünür
         const hidables = document.querySelectorAll<HTMLElement>(
           '[data-pill-hide="true"]',
         );
+        const showables = document.querySelectorAll<HTMLElement>(
+          '[data-pill-show="true"]',
+        );
         if (scrolled) {
           pillWrap.style.padding = "12px 16px 0";
           header.style.maxWidth = "1100px";
@@ -44,6 +47,9 @@ export function HeaderScrollEffect() {
           hidables.forEach((el) => {
             el.style.display = "none";
           });
+          showables.forEach((el) => {
+            el.style.display = "inline-flex";
+          });
         } else {
           pillWrap.style.padding = "";
           header.style.maxWidth = "";
@@ -55,6 +61,9 @@ export function HeaderScrollEffect() {
           hidables.forEach((el) => {
             el.style.display = "";
           });
+          showables.forEach((el) => {
+            el.style.display = "none";
+          });
         }
       }