/* ============================================================
   МИР ЭЛЬДОРИИ — стили страницы world.html
   Интерактивная карта, панель земли, закрытые карточки.
   Только классы с префиксом world-; классы из style.css не переопределяются.
   ============================================================ */

.canon-map {
  overflow: hidden;
  border: 1px solid var(--gold-700);
  border-radius: 20px 6px 20px 6px;
  background: #020a14;
  box-shadow: var(--shadow);
}
.canon-map img { width: 100%; height: auto; }
.canon-map figcaption { padding: .8rem 1rem; color: var(--muted); font-size: .88rem; text-align: center; }

/* ---------- Hero-полоса раздела ---------- */
.world-hero { text-align: center; }
.world-hero__inner { max-width: 780px; }
.world-hero .hero__lead { margin-inline: auto; }
.world-hero__pills { display: flex; flex-wrap: wrap; gap: .6rem; justify-content: center; }

/* ---------- Великая Азбука (широкая карточка) ---------- */
.world-seed { display: grid; grid-template-columns: 1.2fr .8fr; gap: 2.2rem; align-items: center; }
.world-seed__art svg { width: 100%; height: auto; border-radius: 12px; }

/* ---------- Интерактивная карта ---------- */
.world-map {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: var(--shadow);
  background: var(--navy-800);
}
.world-map__svg { display: block; width: 100%; height: auto; }

.world-map__land { cursor: pointer; outline: none; }
.world-map__shape {
  fill: var(--navy-600);
  stroke: rgba(212, 175, 55, .38);
  stroke-width: 1.6;
  transition: stroke .25s ease, stroke-width .25s ease, filter .25s ease;
}
.world-map__land--locked .world-map__shape { fill: var(--navy-700); stroke-dasharray: 5 5; }

.world-map__land:hover .world-map__shape,
.world-map__land:focus .world-map__shape,
.world-map__land.is-active .world-map__shape {
  stroke: var(--gold-500);
  stroke-width: 2.6;
}
.world-map__land:hover .world-map__shape,
.world-map__land.is-active .world-map__shape {
  filter: drop-shadow(0 0 9px rgba(212, 175, 55, .55));
}

.world-map__label {
  fill: var(--muted);
  font-family: var(--font-body);
  font-size: 15px;
  letter-spacing: .02em;
  pointer-events: none;
  transition: fill .25s ease;
}
.world-map__land:hover .world-map__label,
.world-map__land:focus .world-map__label,
.world-map__land.is-active .world-map__label { fill: var(--gold-300); }

/* ---------- Панель выбранной земли ---------- */
.world-land-info { margin-top: 1.4rem; }
.world-land-info__head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .6rem .9rem;
  justify-content: space-between;
  margin-bottom: .6rem;
}
.world-land-info__head h3 { margin: 0; }

/* ---------- Закрытые карточки ---------- */
.world-locked { position: relative; overflow: hidden; }
.world-locked::before {
  content: '';
  position: absolute;
  z-index: 2;
  left: 50%;
  top: 50%;
  width: 30px;
  height: 30px;
  transform: translate(-50%, calc(-50% - 18px));
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F0D68A' stroke-width='1.8' stroke-linecap='round'%3E%3Crect x='5' y='11' width='14' height='9' rx='2'/%3E%3Cpath d='M8 11V8a4 4 0 0 1 8 0v3'/%3E%3C/svg%3E") center / contain no-repeat;
}
.world-locked::after {
  content: 'Откроется после выхода следующей книги';
  position: absolute;
  z-index: 2;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 2.8rem 1.2rem 1.1rem;
  background: rgba(7, 11, 36, .72);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
  color: var(--gold-300);
  font-size: .92rem;
  line-height: 1.5;
  border-radius: inherit;
}

/* силуэт-заглушка в закрытых карточках */
.world-silhouette { width: 64px; margin-bottom: 1rem; opacity: .8; }
.world-silhouette svg { width: 100%; height: auto; }

/* ---------- CTA ---------- */
.world-cta { text-align: center; }
.world-cta__btns { display: flex; flex-wrap: wrap; gap: .9rem; justify-content: center; }

/* ---------- Адаптив ---------- */
@media (max-width: 960px) {
  .world-seed { grid-template-columns: 1fr; }
  .world-seed__art { max-width: 360px; margin-inline: auto; }
}
@media (max-width: 720px) {
  /* SVG масштабируется — увеличиваем подписи, чтобы на телефоне они были не мельче ~11px */
  .world-map__label { font-size: 30px; }
}

/* ---------- Без анимаций ---------- */
@media (prefers-reduced-motion: reduce) {
  .world-map__shape,
  .world-map__label { transition: none; }
}