/***************************************************
 * SVG draw animation (SVG Artista)
 **************************************************/

svg .svg-elem-1 {
  stroke-dashoffset: 269.93133544921875px;
  stroke-dasharray: 269.93133544921875px;
  fill: transparent;
  transition:
    stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0s,
    fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 0.8s;
}
svg.active .svg-elem-1 {
  stroke-dashoffset: 0;
  fill: rgb(255, 255, 255);
}

svg .svg-elem-2 {
  stroke-dashoffset: 509.6700439453125px;
  stroke-dasharray: 509.6700439453125px;
  transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.12s;
}
svg.active .svg-elem-2 { stroke-dashoffset: 0; }

svg .svg-elem-3 {
  stroke-dashoffset: 167.65777587890625px;
  stroke-dasharray: 167.65777587890625px;
  transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.24s;
}
svg.active .svg-elem-3 { stroke-dashoffset: 0; }

svg .svg-elem-4 {
  stroke-dashoffset: 273.5294494628906px;
  stroke-dasharray: 273.5294494628906px;
  transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.36s;
}
svg.active .svg-elem-4 { stroke-dashoffset: 0; }

svg .svg-elem-5 {
  stroke-dashoffset: 273.4129638671875px;
  stroke-dasharray: 273.4129638671875px;
  transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.48s;
}
svg.active .svg-elem-5 { stroke-dashoffset: 0; }

svg .svg-elem-6 {
  stroke-dashoffset: 1434.8411865234375px;
  stroke-dasharray: 1434.8411865234375px;
  transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.6s;
}
svg.active .svg-elem-6 { stroke-dashoffset: 0; }

svg .svg-elem-7 {
  stroke-dashoffset: 413px;
  stroke-dasharray: 413px;
  transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.72s;
}
svg.active .svg-elem-7 { stroke-dashoffset: 0; }

svg .svg-elem-8 {
  stroke-dashoffset: 601.1707763671875px;
  stroke-dasharray: 601.1707763671875px;
  transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.84s;
}
svg.active .svg-elem-8 { stroke-dashoffset: 0; }

svg .svg-elem-9 {
  stroke-dashoffset: 1563.5318603515625px;
  stroke-dasharray: 1563.5318603515625px;
  transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.96s;
}
svg.active .svg-elem-9 { stroke-dashoffset: 0; }

svg .svg-elem-10 {
  stroke-dashoffset: 1992.123291015625px;
  stroke-dasharray: 1992.123291015625px;
  transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 1.08s;
}
svg.active .svg-elem-10 { stroke-dashoffset: 0; }

/***************************************************
 * Loader container
 **************************************************/

.loader {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: grid;
  place-items: center;
  background: #0A0A0A;
}

/* Circle-expand reveal: clip-path grows from center */
.loader.reveal {
  animation: circleReveal 0.9s cubic-bezier(0.19, 1, 0.22, 1) forwards;
}

.loader.reveal svg {
  animation: fadeScale 0.4s ease-out forwards;
}


@keyframes circleReveal {
  0% {
    clip-path: circle(100% at 50% 50%);
  }
  100% {
    clip-path: circle(0% at 50% 50%);
  }
}

@keyframes fadeScale {
  0% {
    opacity: 1;
    transform: scale(1);
  }
  100% {
    opacity: 0;
    transform: scale(0.9);
  }
}

#root {
  overflow-x: hidden;
}
