:root {
  --color-bg: #0D0D0D;
  --color-secondary-bg: #141414;
  --color-primary: white;
  --btn-bg-secondary: white;
  --linear-hero: linear-gradient(181deg, #0d0d0d 17%, rgba(13, 13, 13, 0.7) 31.29%, rgba(13, 13, 13, 0.7) 79.14%, #0d0d0d 93.26%);
}

.lightTheme {
  --color-bg: white;
  --color-secondary-bg: #f1f1f1;
  --color-primary: #000000;
  --btn-bg-secondary: white;
  --linear-hero: linear-gradient(181deg, #ffffff 17%, rgba(255, 255, 255, 0.7) 31.29%, rgba(255, 255, 255, 0.7) 79.14%, #ffffff 93.26%);
}

body.no-scroll {
  overflow: hidden;
}

#preloader {
  position: fixed;
  top:0; left:0;
  width:100%; height:100%;
  background-color: var(--color-bg); /* черный фон */
  display:flex;
  justify-content:center;
  align-items:center;
  z-index:9999;
  transition: opacity 0.5s ease;
}

.preloader_logo{
    max-width: 280px;
    width: 280px;
}

.preloader_logo > .spin > path{
    fill: var(--color-primary) !important;
}

.preloader_logo > .change{
    fill: var(--color-primary) !important;
}

.loader-container {
  display:flex;
  flex-direction:column;
  align-items:center;
}

.spin {
    transform-box: fill-box;      /* берём систему координат SVG */
    transform-origin: center;     /* центр группы */
    animation: spin 4s linear infinite;
  }

  @keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
  }