/* Общие стили */
 body {
     background-color: #171717;
     color: #ffffff;
     font-family: 'Segoe UI', Tahoma, Verdana, sans-serif;
     margin: 0;
     padding: 0;
     position: relative;
 }

 /* Стили для анимированного фона */
 .animated-bg {
     position: fixed;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     z-index: -1;
     background: url("icons/photo1692121144.jpeg") center center / cover no-repeat;
     overflow: hidden;
     filter: blur(8px) brightness(0.6);
     animation: bgAnimation 10s linear infinite;
 }

 .animated-bg::before {
     content: "";
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background: linear-gradient(135deg, rgba(255, 0, 0, 0.6), transparent);
     /* Изменили цвет градиента */
     opacity: 1;
     animation: neonAnimation 2s infinite alternate;
     z-index: -1;
 }

 @keyframes neonAnimation {
     0% {
         transform: scaleX(1);
     }

     100% {
         transform: scaleX(1.1);
     }
 }

 @keyframes bgAnimation {

     0%,
     100% {
         transform: scale(1);
         opacity: 1;
     }

     50% {
         transform: scale(1.02);
         opacity: 0.8;
     }
 }

 /* Стили для контейнера журнала */
 .changelog {
     max-width: 800px;
     margin: 0 auto;
     padding: 20px;
 }

 /* Стили для заголовка */
 .changelog h1 {
     text-align: center;
     font-size: 36px;
     margin-bottom: 20px;
     color: #ff0000;
 }

 .changelog h1::before {
     font-family: "Font Awesome 5 Free";
     content: "\f085";
     /* Иконка с номером Unicode для звезды */
     margin-right: 10px;
     color: #ff0000;
     animation: iconAnimation 2s infinite alternate;
 }

 @keyframes iconAnimation {
     0% {
         transform: scale(1);
     }

     100% {
         transform: scale(1.2);
     }
 }

 /* Стили для карточек */
 .card {
     background-color: #1a1a1a;
     border: none;
     border-radius: 10px;
     margin-bottom: 20px;
     overflow: hidden;
     position: relative;
     transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275), box-shadow 0.3s;
 }

 .card:hover {
     transform: scale(1.08);
     box-shadow: 0 10px 20px rgba(0, 0, 0, 0.6);
 }

 .card-img-top {
     border-top-left-radius: 10px;
     border-top-right-radius: 10px;
     object-fit: cover;
     height: 300px;
 }

 .card-body {
     padding: 20px;
 }

 .card-title {
     font-size: 24px;
     margin-bottom: 10px;
     color: #ff0000;
 }

 .card-text {
     font-size: 18px;
     line-height: 1.6;
     margin-bottom: 15px;
 }

 .card-footer {
     font-size: 14px;
     color: #bdc3c7;
     background-color: #262626;
     border-top: none;
     border-bottom-left-radius: 10px;
     border-bottom-right-radius: 10px;
     padding: 10px 20px;
     display: flex;
     justify-content: space-between;
     align-items: center;
 }

 .video-container {
     position: relative;
     overflow: hidden;
     padding-top: 56.25%;
 }

 .video-container video {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
 }

 .card:focus {
     outline: none;
     box-shadow: 0 0 10px rgba(255, 255, 255, 0.5);
 }