// app/TechBackdrop.tsx
export default function TechBackdrop() {
  return (
    <svg
      className="w-full h-full"
      viewBox="0 0 1440 900"
      preserveAspectRatio="xMidYMid slice"
    >
      <defs>
        {/* Keep only a very subtle vignette, no bright white */}
        <radialGradient id="bg-vignette" cx="50%" cy="0%" r="80%">
          <stop offset="0%"  stopColor="#02061700" />   {/* transparent */}
          <stop offset="60%" stopColor="#02061720" />   {/* very soft */}
          <stop offset="100%" stopColor="#020617ff" />  {/* solid base */}
        </radialGradient>

        <pattern
          id="grid-lines"
          x="0"
          y="0"
          width="120"
          height="120"
          patternUnits="userSpaceOnUse"
        >
          <path
            d="M0 0 H120"
            stroke="rgba(148,163,184,0.10)"
            strokeWidth="0.4"
            strokeDasharray="2 14"
          />
        </pattern>

        <style>
          {`
          @keyframes draw-line-soft {
            0%   { stroke-dashoffset: 520; opacity: 0.0; }
            30%  { stroke-dashoffset: 0;   opacity: 0.25; }
            70%  { stroke-dashoffset: 0;   opacity: 0.25; }
            100% { stroke-dashoffset: -520; opacity: 0.0; }
          }
        `}
        </style>
      </defs>

      {/* Flat dark blue base */}
      <rect width="1440" height="900" fill="#020617" />
      {/* Very subtle vignette over it */}
      <rect width="1440" height="900" fill="url(#bg-vignette)" />

      {/* Faint lines */}
      <rect
        x="-200"
        y="160"
        width="1800"
        height="600"
        fill="url(#grid-lines)"
        opacity="0.22"
      />

      {/* Soft trajectory line, toned down */}
      <path
        d="M-120 760 Q 540 420 1200 520 T 1680 260"
        fill="none"
        stroke="rgba(148,163,184,0.28)"
        strokeWidth="0.7"
        strokeDasharray="520 520"
        strokeDashoffset="520"
        style={{
          animation: 'draw-line-soft 26s ease-in-out infinite',
        }}
      />
    </svg>
  );
}