SVG logo is not filled

Question

I have logo of client in SVG, i created a "draw" animation but there is a space between lines (as you can see on the image)

When i use "fill: white;" on the "path" element, the fill is there instantly so the "draw" animation is almost invisible. I also tried to create a new @Keyframe to that but the fill instantly appears after the animation and also in a couple of seconds instantly disappears.. when i set the "stroke-width" to for example 7px, its filled but now its too wide.. The code:

<div class="box">
  <svg class="svg-logo" width="740" height="454" viewbox="0 0 740 454">
   <path class="outline" d="*SVG PATH*" stroke: "white" stroke-opacity:".5" stroke-minerlimit="10">
   <path class="outline" d="*SVG PATH*" stroke: "white" stroke-opacity:".5" stroke-minerlimit="10">

   <path class="circle" d="*SVG PATH*" stroke: "white" stroke-minerlimit="10">
   <path class="circle" d="*SVG PATH*" stroke: "white" stroke-minerlimit="10">
  </svg>
 </div>

.svg-logo {
    max-width:700px;
    padding-top: 100px;
    stroke-dasharray: 10000;
    animation: 15s write;
}
@keyframes write {
    0% {
        stroke-dashoffset: 10000; 
    }
    100% {
        stroke-dashoffset: 0;
    }
}