/* World map styling — fits article layout */
.world-map-figure {
  margin: 2.0rem 0;
  display: block;
  text-align: center;
  max-width: 100%;
}

/* container that limits width of the image to article column */
.world-map-figure .world-map-img {
  width: 100%;
  max-width: 1100px;        /* change if you want wider/narrower */
  height: auto;
  display: block;
  margin: 0.5rem auto;
  border-radius: 6px;
  box-shadow: 0 10px 30px rgba(3,4,6,0.65);
  object-fit: cover;
  transition: transform .35s ease, box-shadow .35s ease;
  /* soft "page" feel by slightly desaturating */
  filter: saturate(.92) contrast(.98);
  /* subtle vignette via pseudo-element below (fallback if mask not supported) */
  position: relative;
}

/* hover lift on pointer devices */
.world-map-figure a:hover .world-map-img,
.world-map-figure a:focus .world-map-img {
  transform: translateY(-6px) scale(1.01);
  box-shadow: 0 18px 40px rgba(3,4,6,0.7);
}

/* caption styling */
.map-caption {
  color: var(--text, #efe6d5);
  opacity: .9;
  margin-top: .6rem;
  font-size: .95rem;
  line-height: 1.4;
  max-width: 1100px;
  margin-left: auto;
  margin-right: auto;
  text-align: left;
  padding: 0 .5rem;
}

/* soft edge fade (modern browsers) */
.world-map-img {
  -webkit-mask-image: radial-gradient(ellipse at center, rgba(0,0,0,1) 75%, rgba(0,0,0,0.0) 100%);
  mask-image: radial-gradient(ellipse at center, rgba(0,0,0,1) 78%, rgba(0,0,0,0.0) 100%);
}

/* responsive adjustments */
@media (max-width: 900px) {
  .world-map-figure .world-map-img {
    max-width: 100%;
    border-radius: 4px;
    box-shadow: 0 8px 18px rgba(3,4,6,0.55);
  }
  .map-caption { font-size: .9rem; text-align: left; }
}

/* Optional: small scale / coordinate element on corner */
.world-map-figure .map-scale {
  display: inline-block;
  font-size: .85rem;
  color: rgba(239,230,213,0.9);
  background: rgba(6,8,10,0.35);
  padding: .18rem .45rem;
  border-radius: 4px;
  margin-top: .4rem;
  backdrop-filter: blur(2px);
}

/* Map container */
.world-map-figure {
  position: relative;
  margin: 2rem 0;
  text-align: center;
  max-width: 1100px;
  margin-left: auto;
  margin-right: auto;
}

/* Map image */
.world-map-img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 6px;
  box-shadow: 0 12px 32px rgba(0,0,0,0.7);
}

/* =============================================================================
   WORLD PODSTRÁNKA — character cards + tweaks
   ============================================================================= */

/* Skryť Joomla page title nad article-saga */
.component-area > .container > h1,
.component-area > .container > h2.page-header,
.item-page > h2,
.page-header:not(.article-saga) {
  display: none !important;
}

/* Character cards grid */
.character-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-top: 24px;
}

.character-card {
  background: rgba(217,179,131,0.06);
  border: 1px solid rgba(217,179,131,0.18);
  border-radius: 10px;
  padding: 22px 24px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  cursor: default;
  overflow: visible;
}

.character-header {
  display: flex;
  align-items: baseline;
  gap: 10px;
}

.character-name {
  font-family: 'Uncial Antiqua', serif;
  font-size: 1.3rem;
  background: linear-gradient(180deg, #fff8e0 0%, #e6bd6d 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  filter: drop-shadow(0 1px 4px rgba(0,0,0,0.6));
}

.character-born {
  font-size: 0.78rem;
  color: #8a7a62;
  letter-spacing: 0.5px;
  font-style: italic;
}

.character-desc {
  font-size: 0.95rem;
  line-height: 1.7;
  color: #cfc1a8;
  margin: 0;
  max-width: 100%;
  word-break: normal;
  overflow-wrap: break-word;
}

/* Mobile */
@media (max-width: 900px) {
  .character-cards {
    grid-template-columns: 1fr;
  }
}

.world-adventurers .character-card {
  cursor: default !important;
  padding: 22px 24px !important;
  overflow: visible !important;
}