<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 600 500" width="600" height="500" role="img" aria-label="E-Ticaret platformu görseli">
  <defs>
    <linearGradient id="bg1" x1="0" y1="0" x2="1" y2="1">
      <stop offset="0%" stop-color="#1e293b"/>
      <stop offset="100%" stop-color="#0f172a"/>
    </linearGradient>
    <linearGradient id="primary1" x1="0" y1="0" x2="1" y2="1">
      <stop offset="0%" stop-color="#be0017"/>
      <stop offset="100%" stop-color="#ff4d61"/>
    </linearGradient>
    <radialGradient id="glow1" cx="50%" cy="40%" r="60%">
      <stop offset="0%" stop-color="#be0017" stop-opacity="0.35"/>
      <stop offset="100%" stop-color="#be0017" stop-opacity="0"/>
    </radialGradient>
    <filter id="shadow1" x="-20%" y="-20%" width="140%" height="140%">
      <feDropShadow dx="0" dy="20" stdDeviation="25" flood-color="#000" flood-opacity="0.5"/>
    </filter>
  </defs>

  <!-- Background -->
  <rect width="600" height="500" fill="url(#bg1)" rx="24"/>
  <rect width="600" height="500" fill="url(#glow1)" rx="24"/>

  <!-- Floating bg shapes -->
  <circle cx="80" cy="80" r="40" fill="#be0017" fill-opacity="0.08"/>
  <circle cx="520" cy="420" r="60" fill="#3b82f6" fill-opacity="0.08"/>

  <!-- Browser window -->
  <g filter="url(#shadow1)">
    <rect x="60" y="80" width="480" height="340" rx="16" fill="#ffffff"/>
    <rect x="60" y="80" width="480" height="36" rx="16" fill="#f1f5f9"/>
    <rect x="60" y="98" width="480" height="18" fill="#f1f5f9"/>
    <circle cx="80" cy="98" r="5" fill="#ef4444"/>
    <circle cx="98" cy="98" r="5" fill="#f59e0b"/>
    <circle cx="116" cy="98" r="5" fill="#22c55e"/>
    <rect x="160" y="91" width="220" height="14" rx="7" fill="#e2e8f0"/>

    <!-- Header bar -->
    <rect x="80" y="138" width="120" height="14" rx="3" fill="#0f172a"/>
    <rect x="380" y="135" width="60" height="20" rx="10" fill="url(#primary1)"/>
    <rect x="450" y="135" width="60" height="20" rx="10" fill="#e2e8f0"/>

    <!-- Hero area -->
    <rect x="80" y="175" width="200" height="14" rx="3" fill="#0f172a"/>
    <rect x="80" y="195" width="160" height="10" rx="3" fill="#94a3b8"/>
    <rect x="80" y="215" width="100" height="28" rx="14" fill="url(#primary1)"/>

    <!-- Product grid -->
    <g>
      <rect x="80" y="265" width="130" height="120" rx="8" fill="#f8fafc" stroke="#e2e8f0"/>
      <rect x="92" y="277" width="106" height="62" rx="4" fill="#e2e8f0"/>
      <rect x="92" y="349" width="80" height="8" rx="2" fill="#0f172a"/>
      <rect x="92" y="363" width="50" height="8" rx="2" fill="#be0017"/>

      <rect x="225" y="265" width="130" height="120" rx="8" fill="#f8fafc" stroke="#e2e8f0"/>
      <rect x="237" y="277" width="106" height="62" rx="4" fill="#e2e8f0"/>
      <rect x="237" y="349" width="80" height="8" rx="2" fill="#0f172a"/>
      <rect x="237" y="363" width="50" height="8" rx="2" fill="#be0017"/>

      <rect x="370" y="265" width="130" height="120" rx="8" fill="#f8fafc" stroke="#e2e8f0"/>
      <rect x="382" y="277" width="106" height="62" rx="4" fill="#e2e8f0"/>
      <rect x="382" y="349" width="80" height="8" rx="2" fill="#0f172a"/>
      <rect x="382" y="363" width="50" height="8" rx="2" fill="#be0017"/>
    </g>
  </g>

  <!-- Top right corner decorative -->
  <g opacity="0.7">
    <rect x="540" y="20" width="40" height="40" rx="8" fill="#be0017" transform="rotate(15 560 40)"/>
  </g>

  <!-- Watermark text -->
  <text x="300" y="468" text-anchor="middle" font-family="Inter, sans-serif" font-size="10" font-weight="600" fill="#64748b" letter-spacing="2">E-TİCARET · DEMO GÖRSELİ</text>
</svg>
