header.svg

<svg viewBox="0 0 800 400" xmlns="http://www.w3.org/2000/svg">
  <defs>
    <!-- Gradients -->
    <linearGradient id="spaceGrad" x1="0%" y1="0%" x2="100%" y2="100%">
      <stop offset="0%" style="stop-color:#0a192f;stop-opacity:1" />
      <stop offset="100%" style="stop-color:#112240;stop-opacity:1" />
    </linearGradient>
    
    <!-- Filters -->
    <filter id="glow">
      <feGaussianBlur stdDeviation="2" result="coloredBlur"/>
      <feMerge>
        <feMergeNode in="coloredBlur"/>
        <feMergeNode in="SourceGraphic"/>
      </feMerge>
    </filter>

    <!-- Star pattern -->
    <pattern id="stars" width="50" height="50" patternUnits="userSpaceOnUse">
      <circle cx="25" cy="25" r="1" fill="#40E0D0" fill-opacity="0.3">
        <animate attributeName="opacity" 
                 values="0.3;1;0.3" 
                 dur="3s" 
                 repeatCount="indefinite"/>
      </circle>
      <circle cx="10" cy="10" r="1" fill="#40E0D0" fill-opacity="0.5">
        <animate attributeName="opacity" 
                 values="0.5;1;0.5" 
                 dur="4s" 
                 repeatCount="indefinite"/>
      </circle>
      <circle cx="40" cy="40" r="1" fill="#40E0D0" fill-opacity="0.4">
        <animate attributeName="opacity" 
                 values="0.4;1;0.4" 
                 dur="5s" 
                 repeatCount="indefinite"/>
      </circle>
    </pattern>
  </defs>

  <!-- Background -->
  <rect width="100%" height="100%" fill="url(#spaceGrad)"/>
  <rect width="100%" height="100%" fill="url(#stars)"/>

  <!-- Main Logo K -->
  <g transform="translate(400, 200)" filter="url(#glow)">
    <path d="M-40,-60 L-20,-60 L-20,60 L-40,60 Z M-20,0 L40,-60 L65,-60 L5,0 L65,60 L40,60 L-20,0" 
          fill="#40E0D0" opacity="0.9">
      <animate attributeName="opacity" 
               values="0.9;1;0.9" 
               dur="3s" 
               repeatCount="indefinite"/>
    </path>
  </g>

  <!-- Saturn -->
  <g transform="translate(550, 150)">
    <ellipse cx="0" cy="0" rx="40" ry="40" fill="#40E0D0" opacity="0.8"/>
    <g transform="rotate(-15)">
      <ellipse cx="0" cy="0" rx="60" ry="15" fill="none" stroke="#40E0D0" stroke-width="2" opacity="0.6"/>
      <ellipse cx="0" cy="0" rx="55" ry="10" fill="none" stroke="#40E0D0" stroke-width="1" opacity="0.4"/>
    </g>
  </g>

  <!-- GSLV Mk III Rocket -->
  <g transform="translate(250, 250)">
    <g transform="rotate(-45)">
      <!-- Main rocket body -->
      <path d="M-8,30 L-8,-40 L8,-40 L8,30 Z" fill="#40E0D0" opacity="0.9"/>
      <!-- Nose cone -->
      <path d="M-8,-40 L0,-55 L8,-40 Z" fill="#40E0D0" opacity="0.9"/>
      <!-- Boosters -->
      <path d="M-12,-20 L-12,20 L-8,20 L-8,-20 Z" fill="#40E0D0" opacity="0.8"/>
      <path d="M12,-20 L12,20 L8,20 L8,-20 Z" fill="#40E0D0" opacity="0.8"/>
      <!-- Astronaut (larger and more detailed) -->
      <g transform="translate(0,-25) scale(0.8)">
        <!-- Helmet -->
        <circle cx="0" cy="0" r="4" fill="#40E0D0" opacity="1"/>
        <!-- Body -->
        <path d="M-3,4 L3,4 L2,12 L-2,12 Z" fill="#40E0D0" opacity="0.9"/>
        <!-- Arms -->
        <path d="M-3,6 L-6,8 M3,6 L6,8" stroke="#40E0D0" stroke-width="1.5" opacity="0.9"/>
        <!-- Legs -->
        <path d="M-2,12 L-3,16 M2,12 L3,16" stroke="#40E0D0" stroke-width="1.5" opacity="0.9"/>
      </g>
      <!-- Indian Flag -->
      <g transform="translate(10,-35) scale(1)"> <!-- Increased scale from 0.6 to 1 -->
        <!-- Flag pole -->
        <line x1="0" y1="0" x2="0" y2="15" stroke="#40E0D0" stroke-width="1"/>
        
        <!-- Flag (tri-color with Ashoka Chakra) -->
        <rect x="0" y="0" width="15" height="3" fill="#FF9933"/> <!-- Saffron -->
        <rect x="0" y="3" width="15" height="3" fill="#FFFFFF"/> <!-- White -->
        <rect x="0" y="6" width="15" height="3" fill="#138808"/> <!-- Green -->
        
        <!-- Ashoka Chakra -->
        <g transform="translate(7.5,4.5) scale(0.15)"> <!-- Positioned in center of white band -->
          <circle cx="0" cy="0" r="8" fill="#000080"/> <!-- Navy blue circle -->
          <!-- 24 spokes -->
          <g stroke="#000080" stroke-width="1">
            <path d="M0,-8 L0,8 M-8,0 L8,0"/>
            <path d="M-5.66,-5.66 L5.66,5.66 M-5.66,5.66 L5.66,-5.66"/>
            <path d="M-2.83,-7.65 L2.83,7.65 M-7.65,-2.83 L7.65,2.83"/>
            <path d="M-7.65,2.83 L7.65,-2.83 M-2.83,7.65 L2.83,-7.65"/>
          </g>
        </g>
      </g>
      <!-- Rocket exhaust -->
      <path d="M-8,30 L0,60 L8,30" fill="#40E0D0" opacity="0.4">
        <animate attributeName="opacity" 
                 values="0.4;0.8;0.4" 
                 dur="0.5s" 
                 repeatCount="indefinite"/>
      </path>
      <!-- Animation for rocket -->
      <animateTransform attributeName="transform"
                      type="translate"
                      values="0,0; 0,-10; 0,0"
                      dur="2s"
                      repeatCount="indefinite"/>
    </g>
  </g>

  <!-- Pulsar with rotation animation -->
  <g transform="translate(650, 300)">
    <!-- Central star -->
    <circle cx="0" cy="0" r="5" fill="#40E0D0"/>
  
    <!-- Two narrow rotating beams -->
    <g>
      <path d="M0,-20 L0,20"
            stroke="#40E0D0"
            stroke-width="2"
            stroke-linecap="round"
            opacity="0.8">
        <animateTransform
          attributeName="transform"
          type="rotate"
          from="0 0 0"
          to="360 0 0"
          dur="2.5s"
          repeatCount="indefinite"/>
      </path>
    </g>
  </g>

  <!-- Animated Orbital paths -->
  <g transform="translate(400, 200)">
    <!-- Outer orbit -->
    <circle cx="0" cy="0" r="180" fill="none" stroke="#40E0D0" stroke-width="1" stroke-dasharray="4 4" opacity="0.3">
      <animateTransform
        attributeName="transform"
        type="rotate"
        from="0 0 0"
        to="360 0 0"
        dur="30s"
        repeatCount="indefinite"/>
    </circle>
    <!-- Inner orbit -->
    <circle cx="0" cy="0" r="120" fill="none" stroke="#40E0D0" stroke-width="1" stroke-dasharray="4 4" opacity="0.3">
      <animateTransform
        attributeName="transform"
        type="rotate"
        from="360 0 0"
        to="0 0 0"
        dur="20s"
        repeatCount="indefinite"/>
    </circle>
    <!-- Middle orbit with different rotation -->
    <circle cx="0" cy="0" r="150" fill="none" stroke="#40E0D0" stroke-width="1" stroke-dasharray="4 4" opacity="0.3">
      <animateTransform
        attributeName="transform"
        type="rotate"
        from="0 0 0"
        to="360 0 0"
        dur="25s"
        repeatCount="indefinite"/>
    </circle>
  </g>
</svg>