// Marques (motorcycle brands) data + page components.
// Exports to window: MARQUES_DETAIL, BLOG_POSTS, MarquePage, BlogPostPage, BlogIndexPage
//
// Görseller: CSS-based brand block (renk gradient + brushed metal + logo harfi).
// Gerçek motor fotoğrafları yüklendiğinde data'da `hero` field'ı set edilir,
// otomatik olarak background-image olarak kullanılır.

const MARQUES_DETAIL = [
  {
    slug: "honda", name: "Honda", country: "JP", flag: "🇯🇵",
    color: "#E60012", color2: "#8a0008",
    founded: 1948, hq: "Tokyo, Japan",
    slogan: "The Power of Dreams",
    intro: "Dünyanın en büyük motor üreticisi. Soichiro Honda 1948'de bir bisiklet motoruyla başladığı yolculuğu, bugün 4 kıtada üretim, MotoGP'de zafer ve yolda her gün milyonlarca rider ile sürdürüyor.",
    models: [
      { name: "CBR1000RR-R Fireblade SP", category: "Süper Sport", year: 2026, hp: 217, weight: 201, price: "₺1.450.000+" },
      { name: "Africa Twin 1100",          category: "Adventure",   year: 2026, hp: 102, weight: 238, price: "₺1.100.000+" },
      { name: "CB1000R Black Edition",     category: "Naked",       year: 2025, hp: 145, weight: 212, price: "₺850.000+"  },
      { name: "Gold Wing Tour",            category: "Touring",     year: 2026, hp: 126, weight: 383, price: "₺2.400.000+" },
      { name: "PCX 160",                   category: "Scooter",     year: 2026, hp: 16,  weight: 132, price: "₺195.000+"  },
    ],
    achievements: [
      "MotoGP — 25+ pilotlar şampiyonluğu",
      "Isle of Man TT — 75+ kazanma",
      "Dakar Rallisi — 6 kazanma (Africa Twin lineage)",
    ],
  },
  {
    slug: "yamaha", name: "Yamaha", country: "JP", flag: "🇯🇵",
    color: "#0E3B7A", color2: "#04173a",
    founded: 1955, hq: "Iwata, Japan",
    slogan: "Revs Your Heart",
    intro: "Hassasiyet ve ses. Yamaha'nın motor felsefesi: yolu hisset, motoru duy. R1'in cross-plane crank sesinden MT serisinin agresif tasarım dilinde aynı DNA çalışır.",
    models: [
      { name: "YZF-R1",         category: "Süper Sport", year: 2026, hp: 200, weight: 201, price: "₺1.350.000+" },
      { name: "MT-09 SP",       category: "Naked",       year: 2026, hp: 119, weight: 190, price: "₺680.000+"   },
      { name: "Ténéré 700",     category: "Adventure",   year: 2026, hp: 73,  weight: 204, price: "₺720.000+"   },
      { name: "Tracer 9 GT+",   category: "Sport Touring",year: 2025, hp: 119, weight: 223, price: "₺850.000+"   },
      { name: "XSR900",         category: "Neo-Retro",   year: 2026, hp: 117, weight: 193, price: "₺640.000+"   },
    ],
    achievements: [
      "MotoGP — Valentino Rossi ile 4 şampiyonluk",
      "Dakar Rallisi — 9 kazanma",
      "Cross-plane crankshaft — sektörü değiştiren teknoloji",
    ],
  },
  {
    slug: "bmw", name: "BMW Motorrad", country: "DE", flag: "🇩🇪",
    color: "#1C69D4", color2: "#062a59",
    founded: 1923, hq: "Berlin, Germany",
    slogan: "Make Life A Ride",
    intro: "100 yılı aşkın boxer-motor mirası. R serisinin ikonik flat-twin'inden modern S 1000 RR'nin teknolojik çılgınlığına. Mühendislik disiplini ile yolculuk konforunu birleştirir.",
    models: [
      { name: "S 1000 RR",      category: "Süper Sport", year: 2026, hp: 210, weight: 197, price: "₺2.100.000+" },
      { name: "R 1300 GS",      category: "Adventure",   year: 2026, hp: 145, weight: 237, price: "₺1.950.000+" },
      { name: "M 1000 R",       category: "Naked",       year: 2025, hp: 210, weight: 199, price: "₺1.700.000+" },
      { name: "F 900 GS",       category: "Adventure",   year: 2026, hp: 105, weight: 219, price: "₺850.000+"   },
      { name: "K 1600 GTL",     category: "Touring",     year: 2026, hp: 160, weight: 364, price: "₺3.200.000+" },
    ],
    achievements: [
      "Dakar Rallisi — 6 kazanma (1981 ilk kazanma)",
      "WSBK — 2024 manufacturer şampiyonluğu",
      "GS serisi — 40 yıldır adventure dünyasının kralı",
    ],
  },
  {
    slug: "ktm", name: "KTM", country: "AT", flag: "🇦🇹",
    color: "#FF6600", color2: "#7a3000",
    founded: 1934, hq: "Mattighofen, Austria",
    slogan: "Ready to Race",
    intro: "Yarış DNA'sı her motora kazınmış. Off-road ve enduro şampiyonluklarından doğan KTM, sokağa çıktığında bile o pist agresifliğini bırakmıyor. Turuncu, sadece bir renk değil — duruş.",
    models: [
      { name: "1390 Super Duke R EVO", category: "Hyper Naked", year: 2026, hp: 190, weight: 200, price: "₺1.480.000+" },
      { name: "RC 8C",                 category: "Track Only",  year: 2026, hp: 135, weight: 140, price: "—" },
      { name: "890 Adventure R",       category: "Adventure",   year: 2026, hp: 105, weight: 210, price: "₺780.000+"   },
      { name: "390 Duke",              category: "Naked",       year: 2026, hp: 45,  weight: 165, price: "₺320.000+"   },
      { name: "300 EXC",               category: "Enduro",      year: 2026, hp: 50,  weight: 105, price: "₺495.000+"   },
    ],
    achievements: [
      "Dakar Rallisi — 19 kazanma (rekor)",
      "MotoGP — 2024'te ikinci şampiyon yıl",
      "EXC enduro serisi — sektörün referansı",
    ],
  },
  {
    slug: "ducati", name: "Ducati", country: "IT", flag: "🇮🇹",
    color: "#CC0033", color2: "#570015",
    founded: 1926, hq: "Bologna, Italy",
    slogan: "Italian Style for Two Wheels",
    intro: "Bologna'dan dünyaya. Desmodromic valve sistemi, V-twin'in agresif sound'u, italyan tasarımının duygusu. Ducati sahibi olmak bir motor değil bir kimlik almaktır.",
    models: [
      { name: "Panigale V4 SP2",    category: "Süper Sport",   year: 2026, hp: 215, weight: 191, price: "₺2.800.000+" },
      { name: "Streetfighter V4 SP",category: "Hyper Naked",   year: 2026, hp: 215, weight: 196, price: "₺2.500.000+" },
      { name: "Multistrada V4 RS",  category: "Adventure",     year: 2026, hp: 180, weight: 227, price: "₺2.200.000+" },
      { name: "Monster SP",         category: "Naked",         year: 2025, hp: 111, weight: 188, price: "₺1.200.000+" },
      { name: "Diavel V4",          category: "Power Cruiser", year: 2026, hp: 168, weight: 236, price: "₺2.100.000+" },
    ],
    achievements: [
      "MotoGP — 2022, 2023, 2024 üst üste şampiyon",
      "WSBK — Carl Fogarty ile 4 şampiyonluk + sayısız sonra",
      "Bayliss, Rea, Bautista ile efsane pilotluklar",
    ],
  },
  {
    slug: "kawasaki", name: "Kawasaki", country: "JP", flag: "🇯🇵",
    color: "#3B7A00", color2: "#163000",
    founded: 1963, hq: "Akashi, Japan",
    slogan: "Let The Good Times Roll",
    intro: "Yeşil rengi piste taşıyan marka. Z1 ile modern superbike'ı doğurdu, Ninja serisiyle bir nesli yetiştirdi, H2 ile süpercharged çılgınlığı sokağa indirdi.",
    models: [
      { name: "Ninja ZX-10R",        category: "Süper Sport", year: 2026, hp: 203, weight: 207, price: "₺1.250.000+" },
      { name: "Ninja H2 SX SE",      category: "Hyper Touring", year: 2026, hp: 200, weight: 268, price: "₺2.800.000+" },
      { name: "Z H2",                category: "Hyper Naked", year: 2026, hp: 200, weight: 240, price: "₺2.300.000+" },
      { name: "Versys 1100 SE",      category: "Sport Adventure", year: 2026, hp: 134, weight: 257, price: "₺1.100.000+" },
      { name: "Eliminator 500",      category: "Cruiser",     year: 2025, hp: 45,  weight: 176, price: "₺380.000+"   },
    ],
    achievements: [
      "WSBK — Jonathan Rea ile 6 üst üste şampiyonluk (2015-2020)",
      "H2 — supercharged production sportbike (sektörde tek)",
      "Z1 (1972) — modern Japanese superbike'ın atası",
    ],
  },
  {
    slug: "suzuki", name: "Suzuki", country: "JP", flag: "🇯🇵",
    color: "#005DAA", color2: "#002654",
    founded: 1909, hq: "Hamamatsu, Japan",
    slogan: "Way of Life!",
    intro: "Hassasiyet, dayanıklılık, sürpriz performans. GSX-R ailesi superbike kategorisini tanımladı, V-Strom adventure'a dürüst bir alternatif sundu, Hayabusa ise hızın kendisi oldu.",
    models: [
      { name: "GSX-R1000R",       category: "Süper Sport",   year: 2026, hp: 199, weight: 203, price: "₺1.100.000+" },
      { name: "Hayabusa",         category: "Hyper Sport",   year: 2026, hp: 188, weight: 264, price: "₺1.400.000+" },
      { name: "V-Strom 1050DE",   category: "Adventure",     year: 2026, hp: 107, weight: 252, price: "₺780.000+"   },
      { name: "GSX-S1000",        category: "Naked",         year: 2026, hp: 152, weight: 214, price: "₺680.000+"   },
      { name: "GSX-8S",           category: "Naked",         year: 2025, hp: 82,  weight: 202, price: "₺410.000+"   },
    ],
    achievements: [
      "MotoGP — Joan Mir ile 2020 şampiyonluğu",
      "GSX-R750 (1985) — modern sportbike çağını başlattı",
      "Hayabusa — 1999'da 300 km/s production motor (efsane)",
    ],
  },
  {
    slug: "triumph", name: "Triumph", country: "GB", flag: "🇬🇧",
    color: "#2A2A2A", color2: "#000000",
    founded: 1902, hq: "Hinckley, England",
    slogan: "For the Ride",
    intro: "120+ yıllık ingiliz mirası. Bonneville ile cafe racer kültürünü dünyaya yayan, modern Triple motor'la kendine özgü ses imzası bırakan marka.",
    models: [
      { name: "Speed Triple 1200 RS", category: "Hyper Naked", year: 2026, hp: 180, weight: 198, price: "₺1.350.000+" },
      { name: "Bonneville T120 Black",category: "Modern Classic", year: 2026, hp: 80, weight: 236, price: "₺780.000+"  },
      { name: "Tiger 1200 GT Pro",    category: "Adventure",   year: 2026, hp: 150, weight: 245, price: "₺1.450.000+" },
      { name: "Daytona 660",          category: "Sport",       year: 2025, hp: 95,  weight: 201, price: "₺560.000+"   },
      { name: "Rocket 3 R",           category: "Power Cruiser", year: 2026, hp: 167, weight: 320, price: "₺1.700.000+" },
    ],
    achievements: [
      "Bonneville — 'kasırga' lakaplı land-speed rekor motoru (1956)",
      "Steve McQueen, Marlon Brando — kült film kullanımı",
      "Rocket 3 — dünyanın en büyük seri üretim motor hacmi (2.5L)",
    ],
  },
  {
    slug: "aprilia", name: "Aprilia", country: "IT", flag: "🇮🇹",
    color: "#9B0000", color2: "#3a0000",
    founded: 1945, hq: "Noale, Italy",
    slogan: "Be a Racer",
    intro: "İtalyan motor sporu virtüözü. RSV4 ile Ducati Panigale'ye en sert rakip, Tuono V4 ile naked dünyasının deli kuzeni. Yarış pisti her DNA hücresinde yaşar.",
    models: [
      { name: "RSV4 Factory",      category: "Süper Sport",  year: 2026, hp: 220, weight: 199, price: "₺2.400.000+" },
      { name: "Tuono V4 Factory",  category: "Hyper Naked",  year: 2026, hp: 175, weight: 209, price: "₺2.000.000+" },
      { name: "Tuareg 660",        category: "Adventure",    year: 2026, hp: 80,  weight: 204, price: "₺680.000+"   },
      { name: "RS 660",            category: "Sport",        year: 2026, hp: 100, weight: 183, price: "₺580.000+"   },
      { name: "SR GT 200",         category: "Sport Scooter",year: 2025, hp: 18,  weight: 158, price: "₺195.000+"   },
    ],
    achievements: [
      "WSBK — Max Biaggi ile 2010 şampiyonluğu",
      "Road racing 250cc / 125cc — toplamda 39+ şampiyonluk",
      "RSV4 — 4 silindirli V engine, sektörün tek örneği",
    ],
  },
];

// Marka bazlı blog yazıları (her marka için 3 yazı)
const BLOG_POSTS = [
  // Honda
  { id:"h1", marqueSlug:"honda", title:"CBR1000RR-R Fireblade SP — 2026 model üzerinde 1.000 km",
    excerpt:"Yeni elektronik paketi, ECU mapping farkları ve Öhlins NPX/TTX ikilisinin sokakta gerçek hissi.",
    author:"highside_hana", date:"2026-04-22", readMin:8, tag:"İnceleme" },
  { id:"h2", marqueSlug:"honda", title:"Africa Twin Adventure Sport — 4.500 km Karadeniz turu",
    excerpt:"Sinop'tan başlayan, Kaçkar geçidi üzerinden Artvin'e uzanan rotada Africa Twin'in adventure ruhunu test ettik.",
    author:"torque_dad", date:"2026-04-08", readMin:12, tag:"Tur Raporu" },
  { id:"h3", marqueSlug:"honda", title:"Gold Wing Tour — uzun yol konforu yeniden tanımlanır mı?",
    excerpt:"Honda'nın amiral gemisi Gold Wing'in DCT versiyonuyla 3 haftalık Avrupa turu deneyimi ve servis maliyeti analizi.",
    author:"vstrom_vince", date:"2026-03-19", readMin:10, tag:"Uzun Vade" },

  // Yamaha
  { id:"y1", marqueSlug:"yamaha", title:"R1M ’26 — cross-plane crank'ın hala üstünlüğü var mı?",
    excerpt:"V4 rivallere karşı Yamaha'nın inline-four CP4'ünün son durumu. Mugello'da back-to-back test.",
    author:"apex_kira", date:"2026-04-30", readMin:9, tag:"Pist" },
  { id:"y2", marqueSlug:"yamaha", title:"MT-09 SP — naked sınıfının fiyat-performans şampiyonu",
    excerpt:"Üçüncü generation CP3 motorun pürüzsüzleşen düşük tur tepkisi ve KYB süspansiyon ayarları.",
    author:"knee_down", date:"2026-04-12", readMin:7, tag:"İnceleme" },
  { id:"y3", marqueSlug:"yamaha", title:"Ténéré 700 — rally pedigree'sinin sokak versiyonu",
    excerpt:"Off-road'da yapısal zafiyetler, ön süspansiyonun tutumu ve fabrika geometrisinin gerçek dünya etkisi.",
    author:"highside_hana", date:"2026-03-25", readMin:11, tag:"Off-road" },

  // BMW
  { id:"b1", marqueSlug:"bmw", title:"R 1300 GS — boxer mirası nereye gidiyor",
    excerpt:"40+ yıllık GS lineage'inin son halkası. Yeni shaft drive geometrisi, telelever güncellemesi.",
    author:"torque_dad", date:"2026-04-28", readMin:13, tag:"İnceleme" },
  { id:"b2", marqueSlug:"bmw", title:"S 1000 RR ’24-’26 quickshifter ECU recall — gerçek deneyim",
    excerpt:"Avrupa pazarında etkilenen üniteler, BMW Türkiye'nin recall süreci ve servis tecrübesi.",
    author:"torque_dad", date:"2026-04-15", readMin:6, tag:"Güvenlik" },
  { id:"b3", marqueSlug:"bmw", title:"M 1000 R — naked'a M dokunuşu mu yoksa marketing mi?",
    excerpt:"BMW M divisionun motora kattığı gerçek farklar ve fiyat tag'ının gerekçesi.",
    author:"apex_kira", date:"2026-03-30", readMin:9, tag:"İnceleme" },

  // KTM
  { id:"k1", marqueSlug:"ktm", title:"1390 SD R EVO — first ride megathread özeti",
    excerpt:"Forumdaki 248 yanıtın özeti: hangi pilot ne dedi, ECU farkları, sokak vs pist hissi.",
    author:"highside_hana", date:"2026-05-01", readMin:8, tag:"Topluluk" },
  { id:"k2", marqueSlug:"ktm", title:"890 Adventure R — Anadolu enduro turu için doğru tercih mi?",
    excerpt:"Ağırlık dağılımı, WP XPLOR süspansiyonun gerçek off-road performansı ve servis network'ü.",
    author:"vstrom_vince", date:"2026-04-18", readMin:10, tag:"Adventure" },
  { id:"k3", marqueSlug:"ktm", title:"RC 8C — KTM'nin 500 adetlik track-only canavarı",
    excerpt:"Sokağa çıkmayan, sadece pist için tasarlanmış RC 8C'nin teknik anatomisi ve fiyat-değer dengesi.",
    author:"apex_kira", date:"2026-03-22", readMin:11, tag:"Pist" },

  // Ducati
  { id:"d1", marqueSlug:"ducati", title:"Panigale V4 SP2 — 1.000 mi servis log + fotoğraflar",
    excerpt:"Magnezyum jantların durumu, Brembo Stylema R'nin pad tüketimi, Öhlins TTX36 setup notları.",
    author:"ducati_diaz", date:"2026-04-26", readMin:14, tag:"Uzun Vade" },
  { id:"d2", marqueSlug:"ducati", title:"Streetfighter V4 SP — naked sınıfının apex predator'u",
    excerpt:"V4 motorun naked geometriye etkileri, biposto seat'in gerçek konforu, rüzgar yönetimi.",
    author:"rev_ricci", date:"2026-04-10", readMin:8, tag:"İnceleme" },
  { id:"d3", marqueSlug:"ducati", title:"Multistrada V4 RS — Avrupa adventure turunda 8.500 km",
    excerpt:"Sırt-mola döngüleri, semi-aktif Skyhook süspansiyonun adaptasyonu, otoyolda yakıt menzili.",
    author:"torque_dad", date:"2026-03-15", readMin:13, tag:"Tur Raporu" },

  // Kawasaki
  { id:"kw1", marqueSlug:"kawasaki", title:"Ninja ZX-10R — Jonathan Rea ile aynı şanzımanı kullanmak nasıl",
    excerpt:"Quick shifter mapping, KIBS ABS'in pist davranışı, fabrika geometrisinin Anadolu yollarına uyumu.",
    author:"apex_kira", date:"2026-04-25", readMin:9, tag:"Pist" },
  { id:"kw2", marqueSlug:"kawasaki", title:"H2 SX SE — supercharged sport touring nasıl bir tecrübe",
    excerpt:"Boost gauge'a alıştığınızda yakıt menzili, supercharger sesinin uzun yolda etkisi, teknolojik paket.",
    author:"highside_hana", date:"2026-04-09", readMin:11, tag:"Hyper Touring" },
  { id:"kw3", marqueSlug:"kawasaki", title:"Z H2 — yeşil canavar street legal mi?",
    excerpt:"Naked'a giydirilmiş supercharged motorun şehir içi davranışı, ısı yönetimi, tork karakteristiği.",
    author:"knee_down", date:"2026-03-28", readMin:8, tag:"İnceleme" },

  // Suzuki
  { id:"s1", marqueSlug:"suzuki", title:"Hayabusa 3. nesil — 25. yıl efsane mirası",
    excerpt:"1999'dan 2026'ya 'Busa felsefesi: hız, konfor, dayanıklılık. Yeni ECU mapping ve aerodinamik notlar.",
    author:"vstrom_vince", date:"2026-04-29", readMin:10, tag:"Efsane" },
  { id:"s2", marqueSlug:"suzuki", title:"GSX-R1000R — son nesil GSX-R'lerin sessizleşen popülasyonu",
    excerpt:"Avrupa Euro5 etkisi, satış rakamlarında düşüş, Suzuki'nin superbike geleceğine yönelik beklentiler.",
    author:"apex_kira", date:"2026-04-14", readMin:7, tag:"Pazar Analizi" },
  { id:"s3", marqueSlug:"suzuki", title:"V-Strom 1050DE — Türkiye'de adventure kralı olabilir mi?",
    excerpt:"Servis network, yedek parça erişilebilirliği, 21\" ön jantın gerçek off-road faydası.",
    author:"vstrom_vince", date:"2026-03-20", readMin:12, tag:"Adventure" },

  // Triumph
  { id:"t1", marqueSlug:"triumph", title:"Speed Triple 1200 RS — Triple motorun olgunlaşması",
    excerpt:"İngiliz triple'ın karakteristik sound'u, 1160cc kapasite artışının torku nasıl şekillendirdiği.",
    author:"knee_down", date:"2026-04-27", readMin:9, tag:"İnceleme" },
  { id:"t2", marqueSlug:"triumph", title:"Bonneville T120 Black — modern klasik aslında ne kadar modern",
    excerpt:"6-vites, ride-by-wire, ABS'le donatılmış ama tasarımıyla 60'ları yaşatan Bonneville'in günlük kullanımı.",
    author:"torque_dad", date:"2026-04-11", readMin:8, tag:"Modern Klasik" },
  { id:"t3", marqueSlug:"triumph", title:"Tiger 1200 GT Pro — Triumph adventure'ı GS'e gerçek rakip mi",
    excerpt:"Shaft drive, T-plane crank, semi-aktif süspansiyon. BMW R 1300 GS karşılaştırması.",
    author:"highside_hana", date:"2026-03-26", readMin:13, tag:"Karşılaştırma" },

  // Aprilia
  { id:"a1", marqueSlug:"aprilia", title:"RSV4 Factory — Panigale'nin gerçek rakibi",
    excerpt:"V4 65° vs V4 90°, Öhlins NIX/TTX pist setup'ı, APRC elektronik paketi karşılaştırması.",
    author:"rev_ricci", date:"2026-04-24", readMin:11, tag:"Pist" },
  { id:"a2", marqueSlug:"aprilia", title:"Tuono V4 Factory — naked'ın deli amcası",
    excerpt:"Pure RSV4 motor + naked geometri = ne sorun ne nimet. 175hp street-naked'in günlük kullanımı.",
    author:"apex_kira", date:"2026-04-13", readMin:8, tag:"İnceleme" },
  { id:"a3", marqueSlug:"aprilia", title:"Tuareg 660 — düşük cc adventure pazarının saklı incisi",
    excerpt:"Aprilia parallel-twin'in adventure karakteri, ağırlık dağılımı ve gerçek off-road yetkinliği.",
    author:"vstrom_vince", date:"2026-03-23", readMin:10, tag:"Adventure" },
];

// === Components ===

function MarqueLogoBlock({ marque, size = 56 }) {
  // Tries SVG logo first (/img/marques/{slug}.svg), falls back to gradient + first letter
  const logoUrl = `/img/marques/${marque.slug}.svg`;
  const isWordmark = ["yamaha","ktm","ducati","kawasaki","suzuki","triumph","aprilia"].includes(marque.slug);

  if (isWordmark) {
    // Custom wordmark SVG - shows in its own brand color, no extra background
    return (
      <div style={{
        width: size * 1.6, height: size, borderRadius: 6,
        overflow: "hidden", flexShrink: 0,
        boxShadow: `0 8px 24px -10px ${marque.color}, inset 0 1px 0 rgba(255,255,255,.15)`,
        background: marque.color,
      }}>
        <img src={logoUrl} alt={marque.name + " logo"} style={{width:"100%",height:"100%",display:"block",objectFit:"contain"}} />
      </div>
    );
  }

  // Honda + BMW: real Wikipedia SVG, white background block
  return (
    <div style={{
      width: size, height: size, borderRadius: 6,
      background: "#fff",
      border: "1px solid rgba(255,255,255,.1)",
      display: "grid", placeItems: "center",
      boxShadow: `0 8px 24px -10px ${marque.color}, inset 0 1px 0 rgba(255,255,255,.15)`,
      flexShrink: 0, padding: size * 0.12, overflow: "hidden",
    }}>
      <img src={logoUrl} alt={marque.name + " logo"} style={{width:"100%",height:"100%",objectFit:"contain"}}
        onError={(e) => { e.currentTarget.style.display = "none"; e.currentTarget.parentElement.innerHTML = `<span style="color:${marque.color};font-family:var(--display);font-weight:800;font-size:${size*0.45}px">${marque.name[0]}</span>`; }} />
    </div>
  );
}

function MarquePage({ go, params }) {
  const slug = (params && params.slug) || "honda";
  const marque = MARQUES_DETAIL.find(m => m.slug === slug) || MARQUES_DETAIL[0];
  const posts = BLOG_POSTS.filter(p => p.marqueSlug === slug);
  const cat = (typeof CATEGORIES !== "undefined") ? CATEGORIES.find(c => c.id === slug) : null;

  return (
    <main className="page-fade">

      {/* Hero — büyük marka block */}
      <section className="carbon-soft" style={{borderBottom:"1px solid var(--line)",position:"relative",overflow:"hidden"}}>
        <div style={{position:"absolute",inset:0,background:`radial-gradient(900px 400px at 80% 20%, ${marque.color}33, transparent 65%)`}}/>
        <div style={{position:"absolute",inset:0,background:`radial-gradient(600px 300px at 10% 80%, ${marque.color2}66, transparent 60%)`}}/>
        <div className="wrap" style={{position:"relative",paddingTop:64,paddingBottom:56,display:"grid",gridTemplateColumns:"1fr 1fr",gap:56,alignItems:"end"}}>
          <div>
            <div className="uppercase-eyebrow" style={{marginBottom:14}}>// Marque profile</div>
            <div style={{display:"flex",alignItems:"center",gap:18,marginBottom:18}}>
              <MarqueLogoBlock marque={marque} size={84} />
              <div>
                <h1 className="display" style={{margin:0,fontSize:64,letterSpacing:"-.02em",lineHeight:1}}>{marque.name}</h1>
                <div style={{color:"var(--fg-3)",marginTop:6,fontFamily:"var(--mono)",fontSize:12,letterSpacing:".1em",textTransform:"uppercase"}}>{marque.flag} {marque.hq} · est. {marque.founded}</div>
              </div>
            </div>
            <p style={{fontSize:17,color:"var(--fg-2)",lineHeight:1.6,marginTop:24,maxWidth:560}}>{marque.intro}</p>
            <div style={{marginTop:24,fontFamily:"var(--mono)",fontSize:13,color:marque.color,fontStyle:"italic"}}>"{marque.slogan}"</div>
            <div style={{display:"flex",gap:10,marginTop:32,flexWrap:"wrap"}}>
              <button className="btn btn-primary" onClick={() => go("forum")}>Foruma git <Icon.Arrow /></button>
              <a href={`https://forum.girginlabs.com/c/${slug}`} target="_blank" rel="noopener" className="btn btn-ghost">{marque.name} kategorisi</a>
            </div>
          </div>

          {/* Telemetry block */}
          <div style={{display:"grid",gridTemplateColumns:"1fr 1fr",gap:14}}>
            <StatCard label="Modeller" value={marque.models.length} sub="şu an aktif" tone={marque.color} />
            <StatCard label="Topluluk" value={cat ? cat.threads.toLocaleString("tr-TR") : "—"} sub="thread" />
            <StatCard label="Üyeler" value={cat ? cat.members : "—"} sub="aktif rider" />
            <StatCard label="Kuruluş" value={marque.founded} sub={`${2026 - marque.founded} yıl miras`} />
          </div>
        </div>
      </section>

      {/* Models — kart grid */}
      <section className="wrap" style={{paddingTop:56,paddingBottom:40}}>
        <div style={{display:"flex",alignItems:"baseline",justifyContent:"space-between",marginBottom:20}}>
          <h2 className="display" style={{fontSize:28,margin:0}}>Popüler modeller</h2>
          <div className="uppercase-eyebrow">// Şu an piyasada</div>
        </div>
        <div style={{display:"grid",gridTemplateColumns:"repeat(auto-fill,minmax(290px,1fr))",gap:14}}>
          {marque.models.map(m => <ModelCard key={m.name} model={m} marque={marque} />)}
        </div>
      </section>

      {/* Achievements */}
      <section className="wrap" style={{paddingTop:8,paddingBottom:48}}>
        <div className="card brushed" style={{padding:28}}>
          <div className="uppercase-eyebrow" style={{marginBottom:14}}>// Tarihten</div>
          <h3 className="display" style={{fontSize:22,margin:"0 0 18px"}}>{marque.name} efsane anları</h3>
          <ul style={{listStyle:"none",padding:0,margin:0,display:"grid",gap:10}}>
            {marque.achievements.map((a,i) => (
              <li key={i} style={{display:"flex",alignItems:"flex-start",gap:12,fontSize:14,lineHeight:1.55,color:"var(--fg)"}}>
                <span style={{color:marque.color,fontFamily:"var(--mono)",fontSize:11,marginTop:3}}>0{i+1}</span>
                {a}
              </li>
            ))}
          </ul>
        </div>
      </section>

      {/* Blog */}
      <section className="wrap" style={{paddingTop:8,paddingBottom:64}}>
        <div style={{display:"flex",alignItems:"baseline",justifyContent:"space-between",marginBottom:20}}>
          <h2 className="display" style={{fontSize:28,margin:0}}>{marque.name} blog yazıları</h2>
          <div className="uppercase-eyebrow">// Topluluktan</div>
        </div>
        <div style={{display:"grid",gridTemplateColumns:"repeat(auto-fill,minmax(320px,1fr))",gap:14}}>
          {posts.map(p => <BlogCard key={p.id} post={p} marque={marque} go={go} />)}
        </div>
        {posts.length === 0 && (
          <div className="card" style={{padding:32,textAlign:"center",color:"var(--fg-3)"}}>Bu marka için henüz blog yazısı yok.</div>
        )}
      </section>
    </main>
  );
}

function StatCard({ label, value, sub, tone }) {
  return (
    <div className="card brushed" style={{padding:18,minHeight:96,display:"flex",flexDirection:"column",justifyContent:"space-between"}}>
      <div className="uppercase-eyebrow" style={{fontSize:10}}>{label}</div>
      <div>
        <div className="display" style={{fontSize:30,fontWeight:700,color:tone||"var(--fg)",lineHeight:1,letterSpacing:"-.02em"}}>{value}</div>
        <div style={{fontFamily:"var(--mono)",fontSize:11,color:"var(--fg-3)",marginTop:4,textTransform:"uppercase",letterSpacing:".08em"}}>{sub}</div>
      </div>
    </div>
  );
}

function ModelCard({ model, marque }) {
  return (
    <div className="card lift card-hot" style={{padding:18,position:"relative",overflow:"hidden"}}>
      <div style={{position:"absolute",top:0,left:0,right:0,height:2,background:`linear-gradient(90deg, ${marque.color}, ${marque.color2})`,opacity:.7}}/>
      <div className="uppercase-eyebrow" style={{fontSize:10,color:marque.color,marginTop:4}}>{model.category}</div>
      <div className="display" style={{fontSize:18,fontWeight:600,margin:"6px 0 14px",letterSpacing:"-.01em"}}>{model.name}</div>
      <div style={{display:"grid",gridTemplateColumns:"repeat(3,1fr)",gap:10,marginBottom:14}}>
        <ModelStat label="HP" value={model.hp} />
        <ModelStat label="kg" value={model.weight} />
        <ModelStat label="MY" value={model.year} />
      </div>
      <div style={{borderTop:"1px solid var(--line)",paddingTop:12,fontFamily:"var(--mono)",fontSize:12,color:"var(--fg-2)"}}>{model.price}</div>
    </div>
  );
}

function ModelStat({ label, value }) {
  return (
    <div style={{textAlign:"left"}}>
      <div className="display" style={{fontSize:18,fontWeight:600,lineHeight:1}}>{value}</div>
      <div style={{fontFamily:"var(--mono)",fontSize:9,color:"var(--fg-3)",marginTop:3,textTransform:"uppercase",letterSpacing:".1em"}}>{label}</div>
    </div>
  );
}

function BlogCard({ post, marque, go }) {
  const author = (typeof USERS !== "undefined" && USERS[post.author]) || { name: post.author, color: "#666", initials: "??" };
  return (
    <div className="card lift" style={{padding:0,overflow:"hidden",cursor:"pointer"}} onClick={() => go("blog", { id: post.id })}>
      {/* Cover: gradient banner with marque color */}
      <div style={{height:120,background:`linear-gradient(135deg, ${marque.color}55, ${marque.color2}aa), repeating-linear-gradient(45deg, rgba(255,255,255,.03) 0 1px, transparent 1px 8px)`,position:"relative",borderBottom:"1px solid var(--line)"}}>
        <div style={{position:"absolute",top:12,left:12}}>
          <span className="chip" style={{background:`${marque.color}22`,borderColor:`${marque.color}55`,color:"#fff"}}>{post.tag}</span>
        </div>
        <div style={{position:"absolute",bottom:12,right:12,fontFamily:"var(--mono)",fontSize:10,color:"rgba(255,255,255,.6)",textTransform:"uppercase",letterSpacing:".1em"}}>{post.readMin} dk okuma</div>
      </div>
      <div style={{padding:18}}>
        <h4 className="display" style={{fontSize:16,fontWeight:600,margin:"0 0 8px",lineHeight:1.35,letterSpacing:"-.01em"}}>{post.title}</h4>
        <p style={{fontSize:13,color:"var(--fg-2)",lineHeight:1.55,margin:0,display:"-webkit-box",WebkitLineClamp:2,WebkitBoxOrient:"vertical",overflow:"hidden"}}>{post.excerpt}</p>
        <div style={{display:"flex",alignItems:"center",gap:8,marginTop:14,paddingTop:14,borderTop:"1px solid var(--line)"}}>
          <div style={{width:20,height:20,borderRadius:50,background:author.color,display:"grid",placeItems:"center",fontFamily:"var(--display)",fontSize:9,fontWeight:700,color:"#fff",flexShrink:0}}>{author.initials}</div>
          <div style={{fontSize:11,color:"var(--fg-3)",fontFamily:"var(--mono)"}}>{author.name} · {post.date}</div>
        </div>
      </div>
    </div>
  );
}

function BlogPostPage({ go, params }) {
  const post = BLOG_POSTS.find(p => p.id === (params && params.id)) || BLOG_POSTS[0];
  const marque = MARQUES_DETAIL.find(m => m.slug === post.marqueSlug);
  const author = (typeof USERS !== "undefined" && USERS[post.author]) || { name: post.author, color: "#666", initials: "??", role: "Yazar" };

  return (
    <main className="page-fade">
      {/* Hero */}
      <section className="carbon-soft" style={{borderBottom:"1px solid var(--line)",position:"relative",overflow:"hidden"}}>
        <div style={{position:"absolute",inset:0,background:`radial-gradient(700px 360px at 80% 0%, ${marque.color}33, transparent 65%)`}}/>
        <div className="wrap" style={{position:"relative",paddingTop:48,paddingBottom:36,maxWidth:880}}>
          <div style={{display:"flex",alignItems:"center",gap:10,marginBottom:18}}>
            <button className="btn btn-ghost btn-sm" onClick={() => go("marque", { slug: marque.slug })}>← {marque.name}</button>
            <span className="chip" style={{background:`${marque.color}22`,borderColor:`${marque.color}55`,color:"#fff"}}>{post.tag}</span>
          </div>
          <h1 className="display" style={{margin:0,fontSize:46,lineHeight:1.1,letterSpacing:"-.02em",fontWeight:700}}>{post.title}</h1>
          <div style={{display:"flex",alignItems:"center",gap:12,marginTop:24}}>
            <div style={{width:38,height:38,borderRadius:50,background:author.color,display:"grid",placeItems:"center",fontFamily:"var(--display)",fontSize:14,fontWeight:700,color:"#fff",flexShrink:0,border:"1px solid var(--line-2)"}}>{author.initials}</div>
            <div>
              <div style={{fontSize:14,fontWeight:500}}>{author.name}</div>
              <div style={{fontFamily:"var(--mono)",fontSize:11,color:"var(--fg-3)",letterSpacing:".05em",textTransform:"uppercase"}}>{post.date} · {post.readMin} dk okuma</div>
            </div>
          </div>
        </div>
      </section>

      {/* Body */}
      <section className="wrap" style={{paddingTop:40,paddingBottom:48,maxWidth:760}}>
        <div style={{fontSize:18,lineHeight:1.7,color:"var(--fg-2)",marginBottom:32,fontStyle:"italic",borderLeft:`3px solid ${marque.color}`,paddingLeft:20}}>{post.excerpt}</div>

        <div style={{fontSize:16,lineHeight:1.75,color:"var(--fg-2)",display:"grid",gap:20}}>
          <p>Bu yazı henüz tam içerikle doldurulmadı — VizörHub topluluğu için bir teaser. Yazının tam metni yakında forum.girginlabs.com üzerinde yayımlanacak. Bu sırada {marque.name} hakkındaki diğer blog yazılarına ve forum tartışmalarına göz atabilirsin.</p>
          <p>Ne yazıyor olacak: yazının başlığında geçen tüm konular detayıyla incelenecek. Veriler, sokak tecrübesi, fotoğraflar ve karşılaştırma tabloları gelecek. Şimdilik özet için yukarıdaki blok yeterli.</p>
        </div>

        {/* CTA back to marque */}
        <div className="card brushed" style={{padding:24,marginTop:40,display:"flex",alignItems:"center",justifyContent:"space-between",gap:18,flexWrap:"wrap"}}>
          <div>
            <div className="uppercase-eyebrow" style={{marginBottom:6}}>// Devamı için</div>
            <div className="display" style={{fontSize:18,fontWeight:600}}>{marque.name} sayfası ve forum kategorisi</div>
          </div>
          <div style={{display:"flex",gap:8}}>
            <button className="btn btn-ghost btn-sm" onClick={() => go("marque", { slug: marque.slug })}>{marque.name}</button>
            <button className="btn btn-primary btn-sm" onClick={() => go("forum")}>Forum <Icon.Arrow /></button>
          </div>
        </div>
      </section>
    </main>
  );
}

function BlogIndexPage({ go }) {
  return (
    <main className="page-fade">
      <section className="wrap" style={{paddingTop:48,paddingBottom:32}}>
        <div className="uppercase-eyebrow" style={{marginBottom:14}}>// VizörHub Blog</div>
        <h1 className="display" style={{fontSize:48,margin:"0 0 12px",letterSpacing:"-.02em",fontWeight:700}}>Markalardan & Yollardan</h1>
        <p style={{fontSize:17,color:"var(--fg-2)",lineHeight:1.55,maxWidth:600}}>İncelemeler, tur raporları, servis notları, pist günleri. Her marka için topluluğun kalemiyle.</p>
      </section>
      <section className="wrap" style={{paddingBottom:64}}>
        <div style={{display:"grid",gridTemplateColumns:"repeat(auto-fill,minmax(320px,1fr))",gap:14}}>
          {BLOG_POSTS.slice().sort((a,b) => b.date.localeCompare(a.date)).map(p => {
            const marque = MARQUES_DETAIL.find(m => m.slug === p.marqueSlug);
            return <BlogCard key={p.id} post={p} marque={marque} go={go} />;
          })}
        </div>
      </section>
    </main>
  );
}

Object.assign(window, { MARQUES_DETAIL, BLOG_POSTS, MarquePage, BlogPostPage, BlogIndexPage, MarqueLogoBlock });