.draw-part {
    stroke: #1C939D;
    stroke-width: 2;
    fill: none;
    stroke-dasharray: 1000;
    stroke-dashoffset: 1000;
    opacity: 0;
    transform: scale(0.95);
}

/* Stroke animation only */
.animate .draw-part {
    animation: stroke-draw 3s ease forwards;
}

.animate .draw-part:nth-of-type(1) { animation-delay: 0s; }
.animate .draw-part:nth-of-type(2) { animation-delay: 0.3s; }
.animate .draw-part:nth-of-type(3) { animation-delay: 0.6s; }
.animate .draw-part:nth-of-type(4) { animation-delay: 0.9s; }
.animate .draw-part:nth-of-type(5) { animation-delay: 1.2s; }
.animate .draw-part:nth-of-type(6) { animation-delay: 1.5s; }
.animate .draw-part:nth-of-type(7) { animation-delay: 1.8s; }

@keyframes stroke-draw {
    to {
        stroke-dashoffset: 0;
    }
}

/* After stroke finishes */
.draw-part.filled {
    stroke-dashoffset: 0;
    fill: #1C939D;
    opacity: var(--opacity, 1);
    transform: scale(1);
    transition: fill 0.3s ease, opacity 0.3s ease, transform 0.3s ease;
}
#animated-svg {
    position: absolute !important;
    left: 0 !important;
    top: -150px !important;
    width: auto !important;
    z-index: 1 !important;
    transform: translateX(-40%); /* pousse le SVG vers la gauche */
    pointer-events: none !important;
}

/* Animation stroke */
.draw-part-2 {
    fill: none;
    stroke: #1C939D;
    stroke-width: 2;
    stroke-dasharray: 1000;
    stroke-dashoffset: 1000;
    opacity: 0;
    transform: scale(0.95);
}

.animate-2 .draw-part-2 {
    animation: stroke-draw-2 3s ease forwards;
}

.animate-2 .draw-part-2:nth-of-type(1) { animation-delay: 0s; }
.animate-2 .draw-part-2:nth-of-type(2) { animation-delay: 0.3s; }
.animate-2 .draw-part-2:nth-of-type(3) { animation-delay: 0.6s; }

.draw-part-2.filled {
    fill: #1C939D;
    opacity: var(--opacity, 1);
    transform: scale(1);
    transition: fill 0.3s ease, opacity 0.3s ease, transform 0.3s ease;
}

@keyframes stroke-draw-2 {
    to {
        stroke-dashoffset: 0;
    }
}


#animated-svg-2 {
    position: absolute !important;
    right: -75px !important;
    top: 250px !important;
    z-index: 1 !important;
    width: auto !important;
    height: auto !important;
    max-width: none !important;

    transform: translateX(25%) !important; /* ➕ débordement maîtrisé */
    
    pointer-events: none !important;
    will-change: transform, opacity !important;
    backface-visibility: hidden !important;
}

@media (max-width: 1024px) {
  #animated-svg-2 {
    display:none;
  }
}

.draw-part-3 {
    fill: none;
    stroke: #1C939D;
    stroke-width: 2;
    stroke-dasharray: 1000;
    stroke-dashoffset: 1000;
    opacity: 0;
    transform: scale(0.95);
}

.animate-3 .draw-part-3 {
    animation: stroke-draw-3 3s ease forwards;
}

.animate-3 .draw-part-3:nth-of-type(1) { animation-delay: 0s; }
.animate-3 .draw-part-3:nth-of-type(2) { animation-delay: 0.3s; }
.animate-3 .draw-part-3:nth-of-type(3) { animation-delay: 0.6s; }
.animate-3 .draw-part-3:nth-of-type(4) { animation-delay: 0.9s; }

.draw-part-3.filled {
    fill: #1C939D;
    opacity: var(--opacity, 1);
    transform: scale(1);
    transition: fill 0.3s ease, opacity 0.3s ease, transform 0.3s ease;
}

@keyframes stroke-draw-3 {
    to {
        stroke-dashoffset: 0;
    }
}


#animated-svg-3 {
    position: absolute !important;
    left: -150px !important;
    top: -280px !important;
    z-index: 1 !important;
    width: auto !important;
    transform: translateX(-25%) !important;
    max-width: 100vw !important;
    overflow: hidden !important;
    pointer-events: none !important;
    will-change: transform, opacity !important;
    backface-visibility: hidden !important;
}

.svg-qsn path {
  fill: none;
  stroke: #1C939D;
  stroke-width: 0.5;
  stroke-dasharray: 1000;
  stroke-dashoffset: 1000;
  animation: draw-qsn 3s ease forwards;
}

.svg-qsn path:nth-child(2) { animation-delay: 0.3s; }
.svg-qsn path:nth-child(3) { animation-delay: 0.6s; }
.svg-qsn path:nth-child(4) { animation-delay: 0.9s; }
.svg-qsn path:nth-child(5) { animation-delay: 1.2s; }
.svg-qsn path:nth-child(6) { animation-delay: 1.5s; }
.svg-qsn path:nth-child(7) { animation-delay: 1.8s; }

@keyframes draw-qsn {
  to {
    stroke-dashoffset: 0;
  }
}



