/* контейнер подгрузки */
#embed-container {
  flex: 1;
  width: 100%;
  overflow: auto;
  display: flex;
  justify-content: center;
  align-items: flex-start; /* лучше сверху, иначе при скролле контент прыгает */
  padding: 1vh;
  box-sizing: border-box;

  /* анимация плавного появления/скрытия */
  opacity: 1;
  transform: translateY(0%);
  transition: opacity 0.4s ease, transform 0.4s ease;

  overflow-y: auto;
  scroll-behavior: smooth; /* для якорей внутри */
}

/* скрытое состояние (для замены контента) */
#embed-container.hidden {
  opacity: 0;
}

.info-block {
  width: 100%;
  height: 100%;
  padding: 1vh;
  box-sizing: border-box;
  font: 400 2vh system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  color: #fff;
  overflow-y: auto;
}
.info-block p {
  margin: 0.5vh 0.5vh;
}

.info-block h1,
.info-block h2,
.info-block h3,
.info-block h4,
.info-block h5,
.info-block h6 {
  margin: 1vh 0 0.5vh;
  font-weight: 600;
  line-height: 1.3;
  color: #fff;
}

/* Главный заголовок */
.info-block h1 {
  font-size: 3vh;
  font-weight: 700;
  margin-top: 2vh;
  margin-bottom: 1vh;
  border-bottom: 0.2vh solid rgba(255, 255, 255, 0.2);
  padding-bottom: 0.5vh;
}

/* Второй уровень */
.info-block h2 {
  font-size: 2.5vh;
  font-weight: 600;
  margin-top: 1.5vh;
  margin-bottom: 0.8vh;
}

/* Третий уровень */
.info-block h3 {
  font-size: 2.2vh;
  font-weight: 600;
  margin-top: 1.2vh;
  margin-bottom: 0.6vh;
}

/* Четвёртый–шестой уровни ближе к тексту */
.info-block h4 {
  font-size: 2vh;
  font-weight: 500;
}

.info-block h5 {
  font-size: 1.9vh;
  font-weight: 500;
}

.info-block h6 {
  font-size: 1.8vh;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 0.1vh;
  opacity: 0.8;
}

a.tg-link {
  display: inline-block;
  color: #fff;
  font-weight: 600;
  text-decoration: none; /* можно убрать подчёркивание */
  padding: 4px 6px; /* чтобы была рамка вокруг текста */
  border: 0px solid #fff; /* тонкая рамка DOS */
  border-radius: 2vh; /* закругляем углы */
  box-shadow: 0 0 0 rgba(255, 255, 255, 0); /* начально без свечения */
  transition: color 0.2s ease, transform 0.2s ease;
  animation: frameGlow 2s infinite steps(25, end);
}

a.tg-link:hover {
  color: #00f;
  transform: scale(1.02);
}

a.tg-link:active {
  transform: scale(0.98);
}

@keyframes frameGlow {
  0%,
  100% {
    border: 0.5vh solid rgba(255, 255, 255, 0);   /* тонкая рамка DOS */
    background-color: rgba(255, 255, 255, 0);
  }
  50% {
    border: 0.5vh solid rgba(255, 255, 255, 0.5);   /* тонкая рамка DOS */
    background-color: rgba(255, 255, 255, 0.1);
  }
}

.info-block img.half-img {
  display: block;
  margin: 1vh auto; /* центрируем по горизонтали */
  width: 50%; /* половина ширины контейнера */
  max-width: 40vh; /* ограничение по высоте */
  border-radius: 1vh; /* скруглённые углы */
  box-shadow: 0 0.5vh 2vh rgba(0, 0, 0, 0.3);
}

.info-block img.full-img {
  display: block;
  width: 100%; /* на всю ширину контейнера */
  height: auto; /* сохраняем пропорции */
  margin: 1vh 0; /* отступы сверху и снизу */
  border-radius: 0.8vh; /* чуть мягче углы, чем у half-img */
  box-shadow: 0 0.5vh 2vh rgba(0, 0, 0, 0.25); /* тень помягче */
  object-fit: contain; /* чтобы не искажалось */
}