/* ---------- Переменные длительность анимации процентов и надписи инсталл
  коррелируються со значениями timer  в  функции animationStart------ */
:root {
    --animation-percent-timer: 5.2s; /* значение переменной timer + 0.7s */
    --animation-install-timer: 10s;  /* Длительность анимации показа текста installing  */
}


/* --------  Анимация вращающегося круга ------ */

@keyframes preload_rotation {
    0% {
        transform: rotate(0deg);
        /* opacity: 0; */
    }

    100% {
        transform: rotate(360deg);
        opacity: 1;
    }
}

/* --------  Анимация уменьшения логотипа ------ */
@keyframes logo_min {
    0% {
        transform: scale(1);
        
    }

    100% {
        transform: scale(0.7);
        transition: all 0.2s;
    }
}

/* --------  Анимация появления текстовых элементов------ */
@keyframes text_show {
    100% {
        opacity: 1;
        visibility: visible;
    }
}


.logo {
    position: relative;
    flex-basis: 20%;
    max-width: 88px;
    transition: all 0.2s;
}

.logo__img_scale {
    transform: scale(0.75);
    animation: logo_min 0.45s linear;
    transition: all 0.2s;
}
.logo__img_scale_base {
    transform: scale(1);
    transition: all 0.34s;
}
.logo__preloader {
    position: absolute;
    top: -4px;
    left: -3px;
    width: 78px;
    height: 78px;
    border-radius: 50%;
    z-index: -4;
    background: conic-gradient(#ffffff36 15%, #fff 20%, #293ce3);
    opacity: 0;
}
.logo__preloader::after {
    content: '';
    position: absolute;
    top: 2px;
    left: 2px;
    width: 74px;
    height: 74px;
    border-radius: 50%;
    background: #fff;
}
.logo__preloader_light {
    background: conic-gradient(#ffffff36 15%, #fff 20%, #b0b2c6);
    transition: all 0.3s;
}
.logo__preloader_start {
    animation:  preload_rotation 1.35s linear infinite forwards;
    opacity: 1;
    transition: opacity 0.5s;
}

.produce-section {
    position: relative;
}
.title__producer_hidden {
    opacity: 0;
    transition: 0.15s;
}
.title__producer_show {
    opacity: 1;
    transition: 0.35s;
}

.preloader__data {
    position: absolute;
    top: 0;
    left: 0;
    visibility: hidden;
}
.preloader__data_show {
    visibility: visible;
    opacity: 1;
}
.preloader__data_hidden {
    visibility: hidden;
    opacity: 0;
    transition: all 0.2s;
}
.preload__inst{
    visibility: hidden;
    position: absolute;
}
.preload__process {
    visibility: hidden;
    
}
.preload__process_show {
    animation: text_show var(--animation-percent-timer) linear;
}
.preload__inst_show {
    animation: text_show  var(--animation-install-timer) linear;
}