<header class="site-header">
  <div class="container">
    <div class="site-header-inner">
      <div class="brand header-brand">
        <h1 class="m-0">
          <a href="#">
            <svg
              width="60"
              height="60"
              viewBox="0 0 120 120"
              xmlns="http://www.w3.org/2000/svg"
            >
              <title>{{ .Site.Title }}</title>
              <defs>
                <linearGradient x1="0%" y1="100%" y2="0%" id="logo-a">
                  <stop stop-color="#0559B0" stop-opacity="0" offset="0%" />
                  <stop stop-color="#0559B0" offset="100%" />
                </linearGradient>
                <linearGradient x1="100%" y1="50%" x2="0%" y2="50%" id="logo-b">
                  <stop stop-color="#BE5476" stop-opacity="0" offset="0%" />
                  <stop stop-color="#BE5476" offset="100%" />
                </linearGradient>
              </defs>
              <g fill="none" fill-rule="evenodd">
                <rect
                  fill="url(#logo-a)"
                  width="120"
                  height="120"
                  rx="60"
                  ry="60"
                />
                <circle fill="url(#logo-b)" cx="60" cy="60" r="40" />
              </g>
            </svg>
          </a>
        </h1>
      </div>
    </div>
  </div>
</header>