#header.header-visible {
   background-color: #8f7e6e;
   backdrop-filter: blur(8px);
   box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
   transform: translateY(0%);
   padding: 0.5rem 0vw;
   max-height: 80px;
   transition: all 0.3s ease;
}
#header.header-hidden {
   transform: translateY(-100%);
   transition: all 0.3s ease;
}
#header {
   position: fixed;
   top: 0;
   left: 0;
   width: 100%;
   z-index: 99999;
   height: 60px;
}
a {
   text-decoration: none;
   color: inherit;
}
.header-subpage {
   width: 100%;
   padding: 0;
   box-sizing: border-box;
}

.header-grid-subpage {
   display: flex;
   justify-content: space-between;
   align-items: center;
   width: 100%;
   height: 100%;
   padding: 0.5rem 2vw;
   max-width: 1920px;
   margin: 0 auto;
   box-sizing: border-box;
}

.header-left-subpage,
.header-right-subpage {
   flex: 1;
   display: flex;
   align-items: center;
}

.header-left-subpage {
   justify-content: flex-start;
   font-size: 1.2rem;
   font-weight: 700;
   color: #ffffff;
   text-shadow:
      0 0 6px #87cefa,
      0 0 10px #1e90ff,
      0 0 20px #00bfff;
   opacity: 1;
   white-space: nowrap;
   transform: none;
   animation: none;
}

.header-left-subpage:hover {
   text-shadow:
      0 0 6px #00bfff,
      0 0 12px #1e90ff,
      0 0 20px #2600ff,
      0 0 28px #2600ff;
   transform: scale(1.02);
}

@keyframes neonFadeIn {
   to {
      opacity: 1;
      transform: translateY(0);
   }
}
.header-center-subpage {
   font-size: 1.2rem;
   color: rgb(54, 51, 51);
   flex: 1;
   display: flex;
   flex-direction: column;
   align-items: center;
   text-align: center;
   text-shadow: 0 0 15px rgb(255, 255, 255);
}

.header-right-subpage {
   justify-content: flex-end;
   color: rgb(255, 255, 255);
   text-shadow: 0 0 5px rgb(255, 255, 255);
   font-size: 1.2rem;
}
.button-white-subpage {
   display: inline-block;
   padding: 0.8rem 2rem;
   background-color: rgb(138, 124, 124);
   color: rgba(255, 255, 255, 0.989);
   text-shadow: 0 1px 4px rgb(0, 0, 0);
   font-size: 1.2rem;
   font-weight: 600;
   border-radius: 1rem;
   box-shadow: 0 0px 6px rgb(0, 0, 0);
   transition:
      transform 0.3s ease,
      box-shadow 0.3s ease;
   text-align: center;
   text-decoration: none;
}

.button-white-subpage:hover {
   transform: translateY(-2px);
   box-shadow: 0 6px 16px rgba(0, 0, 0, 0.15);
}
/* ========== АДАПТАЦИЯ HEADER-SUBPAGE ========== */

@media (max-width: 768px) {
   #header {
      height: auto;
      padding: 1rem;
   }
   .header-grid-subpage {
      flex-direction: row;
      align-items: center;
      justify-content: space-between;
      width: 100%;
      padding: 0.1rem 0.1rem;
      max-width: 100vw;
      gap: 0.3rem;
      box-sizing: border-box;
      min-height: 12px;
   }

   .header-left-subpage {
      font-size: 0.7rem;
      font-weight: 700;
      min-width: 105px;
      max-width: 40vw;
      white-space: nowrap;
      text-shadow:
         0 0 3px #aed1ff,
         0 0 8px #1e90ff,
         0 0 12px #00bfff;
      margin-bottom: 3rem;
   }
   .header-center-subpage {
      font-size: 0.93rem;
      color: #fff;
      text-shadow: 0 0 5px #232323;
      padding: 0 0.2rem;
      line-height: 1.11;
      margin-top: -4rem;
   }
   .header-right-subpage {
      min-width: 88px;
      max-width: 32vw;
      margin-left: 0.1rem;
      margin-top: -4rem;
   }
   .button-white-subpage {
      font-size: 0.77rem;
      padding: 0.18rem 0.55rem;
      min-width: 70px;
      border-radius: 1rem;
      margin: 0;
      background-color: #8a7c7c;
      color: #fff;
      box-shadow: 0 0px 6px #0003;
      text-shadow: 0 1px 4px #000;
      display: inline-block;
   }
   #header.header-visible {
      backdrop-filter: blur(8px);
      transform: translateY(0%);
      padding: 0.5rem 2vw;
      max-height: 60px;
   }
}
@media (min-width: 769px) {
   #header {
      height: 80px;
      padding: 0;
      max-height: 80px;
   }
   .header-grid-subpage {
      flex-direction: row;
      align-items: center;
      justify-content: space-between;
      width: 100%;
      max-width: 1920px;
      padding: 0.5rem 2vw;
      gap: 0;
      min-height: 60px;
      box-sizing: border-box;
   }
   .header-left-subpage {
      font-size: 1.2rem;
      font-weight: 700;
      min-width: 180px;
      max-width: 400px;
      margin-bottom: 0;
      white-space: nowrap;
      text-shadow:
         0 0 6px #87cefa,
         0 0 10px #1e90ff,
         0 0 20px #00bfff;
   }
   .header-center-subpage {
      font-size: 1.2rem;
      color: rgb(54, 51, 51);
      text-shadow: 0 0 15px rgb(255, 255, 255);
      padding: 0;
      margin-top: 0;
   }
   .header-right-subpage {
      min-width: 140px;
      max-width: 350px;
      margin-left: 0;
      margin-top: 0;
   }
   .button-white-subpage {
      font-size: 1.2rem;
      padding: 0.8rem 2rem;
      min-width: 120px;
      border-radius: 1rem;
      margin: 0;
      background-color: rgb(138, 124, 124);
      color: rgba(255, 255, 255, 0.989);
      box-shadow: 0 0px 6px rgb(0, 0, 0);
      text-shadow: 0 1px 4px rgb(0, 0, 0);
      display: inline-block;
   }
   #header.header-visible {
      backdrop-filter: blur(8px);
      transform: translateY(0%);
      padding: 0.5rem 0vw;
      max-height: 80px;
   }
}