/* ==========================================================================
   Legendy (v2 StoryPage, StoryHero, StoryTimeline, ParchmentDeck,
   ParchmentSheet, SheetStack, SeamMark, WaxSeal, StoryQuote).
   Sdílené s homepage: pergamen s trhanými hranami, znak na švu.
   ========================================================================== */

/* Papír kreslí obsah stránky, ne jednotlivé sekce (v2 `main.bg-espero-paper`):
   osa a citát na sebe navazují a jedno zrno přes celou plochu nemá kde
   udělat šev (v2 zná tenkou linku na švu světlých sekcí, viz otevřené body). */
#main-content:has(.es-legend-timeline),
body.et-fb:has(.es-legend-timeline) {
  background-color: var(--espero-paper);
  background-image: var(--es-grain-06);
}
.es-legend-hero,
.es-legend-timeline,
.es-quote {
  position: relative;
  background-color: transparent !important;
}

/* --- Hlavička s medailonem --- */
.es-legend-hero {
  overflow: hidden;
  padding: 9rem 0 4rem !important; /* pt-36 pb-16 */
  background-image:
    radial-gradient(circle at center, rgba(234, 176, 131, 0.35), transparent 70%),
    radial-gradient(circle at center, rgba(248, 234, 197, 0.675), transparent 68%) !important;
  background-repeat: no-repeat !important;
  background-size:
    34rem 34rem,
    40rem 40rem !important;
  background-position:
    right -14vw top -5rem,
    left -10vw top -6rem !important;
}
@media (min-width: 768px) {
  .es-legend-hero {
    padding: 11rem 0 5rem !important; /* md:pt-44 md:pb-20 */
  }
}
.es-legend-hero-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr);
  align-items: center;
  gap: 3.5rem !important; /* gap-14 */
}
@media (min-width: 768px) {
  .es-legend-hero-grid {
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
    gap: 3rem !important; /* md:gap-12 */
  }
}
.es-legend-hero-grid > .et_pb_column {
  width: 100% !important;
  margin: 0 !important;
}
.es-legend-medallion {
  order: 2;
  display: flex !important;
  flex-direction: column;
  align-items: center;
}
.es-legend-intro {
  order: 1;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 1.5rem !important; /* gap-6 */
}
@media (min-width: 768px) {
  .es-legend-medallion {
    order: 1;
  }
  .es-legend-intro {
    order: 2;
  }
}
:where(.es-legend-intro .et_pb_module),
:where(.es-legend-medallion .et_pb_module) {
  margin: 0 !important;
}

/* Medailon: dva soustředné prstence a rytina uprostřed. */
.es-medallion {
  position: relative;
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 16rem !important;
  height: 16rem;
  border: 1px solid rgb(204 104 1 / 0.3);
  border-radius: 9999px;
}
@media (min-width: 640px) {
  .es-medallion {
    width: 18rem !important;
    height: 18rem;
  }
}
@media (min-width: 768px) {
  .es-medallion {
    width: 22rem !important;
    height: 22rem;
  }
}
.es-medallion::before {
  content: '';
  position: absolute;
  inset: 0.75rem;
  border: 1px solid rgb(42 26 16 / 0.1);
  border-radius: 9999px;
}
.es-medallion::after {
  content: '';
  height: 58%;
  aspect-ratio: 76 / 108;
  background-color: rgb(42 26 16 / 0.85);
  -webkit-mask: var(--es-mark) center / contain no-repeat;
  mask: var(--es-mark) center / contain no-repeat;
}

.es-lead p {
  max-width: 36rem;
  margin: 0;
  padding: 0 !important;
  font-size: 15px;
  line-height: 1.625;
  color: var(--espero-inkmuted);
}
@media (min-width: 768px) {
  .es-lead p {
    font-size: 1rem;
  }
}

/* --- Nadpis kapitoly (`CHAPTER_TITLE`) --- */
.es-chapter {
  margin: 0 !important;
  text-align: center;
}
.es-chapter :is(h1, h2) {
  text-align: center;
}

/* --- Časová osa --- */
.es-legend-timeline {
  padding: 5rem 0 11rem !important; /* pt-20 pb-44 */
}
@media (min-width: 768px) {
  .es-legend-timeline {
    padding: 6rem 0 14rem !important; /* md:pt-24 md:pb-56 */
  }
}
.es-legend-timeline .et_pb_column {
  display: block !important;
}
.es-chapter--timeline {
  margin-bottom: 5rem !important; /* mb-20 */
}
@media (min-width: 768px) {
  .es-chapter--timeline {
    margin-bottom: 6rem !important; /* md:mb-24 */
  }
}

.es-timeline {
  position: relative;
  display: flex !important;
  flex-direction: column !important;
  gap: 5rem !important; /* gap-20 */
  width: 100% !important;
  max-width: 56rem; /* max-w-4xl */
  margin: 0 auto !important;
}
@media (min-width: 768px) {
  .es-timeline {
    gap: 6rem !important; /* md:gap-24 */
  }
}
.es-milestone {
  position: relative;
  display: grid !important;
  grid-template-columns: 32px minmax(0, 1fr);
  row-gap: 0.5rem !important; /* mt-2 mezi rokem, nadpisem a textem */
  width: 100% !important;
  margin: 0 !important;
}
.es-milestone > .et_pb_module {
  grid-column: 2;
  margin: 0 !important;
}
@media (min-width: 768px) {
  .es-milestone {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  /* Střídavě vlevo (zarovnáno k ose) a vpravo. */
  .es-milestone:nth-child(odd of .es-milestone) > .et_pb_module {
    grid-column: 1;
    padding-right: 3rem !important; /* pr-12 */
    text-align: right;
  }
  .es-milestone:nth-child(even of .es-milestone) > .et_pb_module {
    grid-column: 2;
    padding-left: 3rem !important; /* pl-12 */
  }
}
.es-ms-year p {
  margin: 0;
  padding: 0 !important;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 1.5rem; /* text-2xl */
  line-height: 1.25;
  color: var(--espero-golddark);
}
/* „25. 9. 1513" je dvakrát delší: o stupeň menší, ať drží v řádku (JS). */
.es-ms-year.is-long p {
  font-size: 1.25rem; /* text-xl */
}
.es-ms-title :is(h2, h3) {
  margin: 0;
  padding: 0 !important;
  font-family: var(--font-display) !important;
  font-weight: 700 !important;
  font-size: 1.25rem !important; /* text-xl */
  line-height: 1.25 !important;
  text-transform: none;
  color: var(--espero-ink) !important;
}
.es-ms-text p {
  max-width: 28rem; /* max-w-md */
  margin: 0;
  padding: 0 !important;
  font-size: 14px;
  line-height: 1.625;
  color: rgb(42 26 16 / 0.7);
}
@media (min-width: 768px) {
  .es-milestone:nth-child(odd of .es-milestone) .es-ms-text p {
    margin-left: auto;
  }
}
.es-voyage {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
}

/* ==========================================================================
   Pergameny (ParchmentDeck + ParchmentSheet). Bez JS, na mobilu a při
   reduced-motion listy pod sebou; od md s JS připnuté (`es-deck--pinned`).
   ========================================================================== */

.es-deck {
  position: relative;
  padding: 0 !important;
  background-color: var(--espero-page) !important; /* prosvítá trhlinami */
  counter-reset: es-sheet;
}
.es-deck > .et_pb_row,
.es-deck-stage > .et_pb_row {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}

/* Znak na švu: půlka nad švem, půlka v pergamenu. */
.es-deck > .es-deck-mark,
.es-deck-mark,
.es-parchment-mark {
  width: auto !important;
  position: absolute !important;
  z-index: 10;
  left: 50%;
  top: 0;
  width: auto !important;
  padding: 0 !important;
  transform: translate(-50%, -50%);
  pointer-events: none;
}
.es-deck-mark .et_pb_column,
.es-parchment-mark .et_pb_column {
  width: auto !important;
  margin: 0 !important;
}
.es-seam-mark {
  margin: 0 !important;
  width: auto !important;
}
.es-seam-mark img {
  display: block;
  width: auto !important;
  height: var(--vasco-mark-h) !important;
  transform: perspective(900px) rotateX(9deg) rotateZ(-9deg);
  transform-origin: center bottom;
  filter: drop-shadow(0 12px 16px rgba(42, 26, 16, 0.38));
  user-select: none;
}

/* Nadpis kapitoly visí pod znakem (`--chapter-top`). */
.es-deck-head {
  position: absolute !important;
  z-index: 20;
  top: var(--chapter-top);
  left: 0;
  right: 0;
  padding: 0 1.5rem !important;
  pointer-events: none;
}

/* --- List --- */
.es-sheet {
  position: relative;
  counter-increment: es-sheet;
  overflow: hidden;
  isolation: isolate;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr);
  align-content: center;
  align-items: center;
  column-gap: 2.5rem !important; /* gap-10 */
  row-gap: 2.5rem !important;
  min-height: 100svh;
  padding:
    max(5rem, 10svh)
    max(1.5rem, calc((100% - 72rem) / 2 + 1.5rem))
    max(2.5rem, 7svh) !important;
  background-color: var(--espero-paper);
  background-size: cover;
  background-position: center;
  -webkit-mask-image: var(--es-torn-top), linear-gradient(#000, #000), var(--es-torn-bottom);
  mask-image: var(--es-torn-top), linear-gradient(#000, #000), var(--es-torn-bottom);
  -webkit-mask-size: 100% 34px, 100% calc(100% - 68px), 100% 34px;
  mask-size: 100% 34px, 100% calc(100% - 68px), 100% 34px;
  -webkit-mask-position: top center, center, bottom center;
  mask-position: top center, center, bottom center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}
@media (min-width: 768px) {
  .es-sheet {
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
    column-gap: 3.5rem !important; /* md:gap-14 */
  }
}
/* První list (a v připnutém režimu všechny) uhne nadpisu kapitoly. */
.es-deck > .es-sheet:nth-child(1 of .es-sheet),
.es-deck--pinned .es-sheet {
  padding-top: var(--chapter-headroom) !important;
}
.es-sheet[data-tint='cream'] {
  background-image: url(../img/parchment/sheet-cream.webp);
}
.es-sheet[data-tint='tan'] {
  background-image: url(../img/parchment/sheet-tan.webp);
}
.es-sheet[data-tint='sepia'] {
  background-image: url(../img/parchment/sheet-sepia.webp);
}
/* Čtyři obrysy roztržení (tornEdges.ts): horní n, spodní n+1. */
.es-sheet:nth-child(4n + 1 of .es-sheet) {
  --es-torn-top: url(../img/torn-top-0.svg);
  --es-torn-bottom: url(../img/torn-bottom-1.svg);
}
.es-sheet:nth-child(4n + 2 of .es-sheet) {
  --es-torn-top: url(../img/torn-top-1.svg);
  --es-torn-bottom: url(../img/torn-bottom-2.svg);
}
.es-sheet:nth-child(4n + 3 of .es-sheet) {
  --es-torn-top: url(../img/torn-top-2.svg);
  --es-torn-bottom: url(../img/torn-bottom-3.svg);
}
.es-sheet:nth-child(4n + 4 of .es-sheet) {
  --es-torn-top: url(../img/torn-top-3.svg);
  --es-torn-bottom: url(../img/torn-bottom-0.svg);
}
/* Zrno přes texturu (mix-blend-multiply), ať se WebP nepruhuje. */
.es-sheet::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background-image: var(--es-grain-06);
  mix-blend-mode: multiply;
  pointer-events: none;
}
/* Vodoznak s pořadím listu (na mobilu ne). */
.es-sheet::after {
  content: counter(es-sheet, upper-roman);
  position: absolute;
  z-index: -1;
  top: 10vh;
  right: 6vw;
  display: none;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 20vh;
  line-height: 1;
  color: rgb(42 26 16 / 0.05);
  pointer-events: none;
  user-select: none;
}
@media (min-width: 768px) {
  .es-sheet::after {
    display: block;
  }
}
.es-sheet > .et_pb_column {
  width: 100% !important;
  margin: 0 !important;
}
.es-sheet-text {
  display: block !important;
}
:where(.es-sheet-text .et_pb_module) {
  margin: 0 !important;
}
.es-sheet-title :is(h1, h2) {
  max-width: 42rem; /* max-w-2xl */
  margin: 0;
  padding: 0 !important;
  font-family: var(--font-display) !important;
  font-weight: 700 !important;
  font-size: min(clamp(1.5rem, 3vw, 2.5rem), 6svh) !important;
  line-height: 1.08 !important;
  text-transform: none;
  text-wrap: balance;
}
.es-sheet-text .es-sheet-body,
.es-sheet-body {
  max-width: 65ch; /* max-w-prose */
  margin-top: max(1rem, 2.4svh) !important;
}
.es-sheet-body p {
  margin: max(0.6rem, 1.4svh) 0 0;
  padding: 0 !important;
  font-size: 15px;
  line-height: 1.625;
  color: rgb(42 26 16 / 0.8);
}
.es-sheet-body p:first-child {
  margin-top: 0;
}

/* Ilustrace jako nalepený výstřižek: trhaný okraj, natočení, stín. */
.es-sheet-artcol {
  display: flex !important;
  justify-content: center;
}
.es-sheet-art {
  margin: 0 auto !important;
  width: auto !important;
  max-width: 100%;
  aspect-ratio: 5 / 6;
  height: min(15rem, 30svh);
  overflow: hidden;
  transform: rotate(-2deg);
  clip-path: polygon(1% 2%, 99% 0%, 98% 99%, 2% 97%);
  box-shadow: 0 14px 28px rgba(42, 26, 16, 0.22);
}
@media (min-width: 768px) {
  .es-sheet-art {
    height: min(28rem, 46svh);
  }
}
.es-sheet-art .et_pb_image_wrap,
.es-sheet-art img {
  display: block;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
}

/* Pečeti: proklik na ostatní listy (JS). */
.es-seals {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 1.25rem; /* gap-5 */
  /* v2 má pečeti mimo mřížku listu; tady jsou její další řádek, odečte se row-gap */
  margin-top: calc(max(1.5rem, 3.2svh) - 2.5rem);
}
.es-seal {
  display: flex;
  align-items: center;
  gap: 0.625rem; /* gap-2.5 */
  min-height: 2.75rem;
  padding: 0;
  border: 0;
  background: none;
  opacity: 0.45;
  transition: opacity 300ms var(--espero-ease-tw);
}
.es-seal:hover {
  opacity: 0.85;
}
.es-seal[aria-current] {
  opacity: 1;
}
.es-seal img {
  width: 1.75rem; /* h-7 w-7 */
  height: 1.75rem;
  transition: all 300ms var(--espero-ease-tw);
}
.es-seal[aria-current] img {
  width: 2.75rem; /* h-11 w-11 */
  height: 2.75rem;
}
.es-seal span {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 1.125rem; /* text-lg */
  line-height: 1;
  color: var(--espero-ink);
}

/* --- Připnutý režim (md+, s JS, bez reduced-motion) --- */
.es-deck--pinned {
  height: calc(var(--es-sheets, 4) * 100svh + 100svh);
}
.es-deck-stage {
  align-self: stretch; /* sekce Divi je flex se středem, jinak má šířku 0 */
  width: 100%;
  position: sticky;
  top: 0;
  height: 100svh;
  overflow: hidden;
  isolation: isolate;
}
.es-deck--pinned .es-deck-stage > .es-sheet {
  position: absolute !important;
  inset: 0;
  min-height: 0;
  height: 100%;
  visibility: hidden;
}
.es-deck--pinned .es-deck-stage > .es-sheet.is-active,
.es-deck--pinned .es-deck-stage > .es-sheet.is-leaving {
  visibility: visible;
}
.es-deck--pinned .es-deck-stage > .es-sheet.is-active {
  z-index: 1;
}
.es-deck--pinned .es-deck-stage > .es-sheet.is-leaving {
  z-index: 2; /* odchozí leží nad příchozím, jinak by z odletu nebylo nic vidět */
}
/* Příchozí list čeká v hromádce (o kus níž, menší), odchozí odletí nahoru. */
@keyframes es-sheet-in {
  from {
    opacity: 0;
    transform: translateY(26px) scale(0.972);
  }
}
@keyframes es-sheet-out {
  78% {
    opacity: 1;
  }
  to {
    opacity: 0;
    transform: translate(-6%, -108%) rotate(-6deg) scale(0.96);
  }
}
.es-deck--pinned .es-sheet.is-entering {
  animation: es-sheet-in 0.55s var(--espero-ease) both;
}
.es-deck--pinned .es-sheet.is-leaving {
  animation: es-sheet-out 0.7s var(--espero-ease) both;
}

/* ==========================================================================
   Citát
   ========================================================================== */

.es-quote {
  overflow: hidden;
  padding: 6rem 0 8rem !important; /* pt-24 pb-32 */
}
@media (min-width: 768px) {
  .es-quote {
    padding: 7rem 0 10rem !important; /* md:pt-28 md:pb-40 */
  }
}
.es-quote::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, transparent 55%, rgba(109, 92, 68, 0.1) 100%);
  pointer-events: none;
}
.es-quote .et_pb_row {
  position: relative;
  z-index: 1;
}
.es-quote-text figure {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.5rem; /* gap-6 */
  margin: 0;
  text-align: center;
}
/* Prázdný odstavec z automatických odstavců WP by zdvojil mezeru `gap`. */
.es-quote-text figure > p:empty {
  display: none;
}
.es-quote-mark {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 4.5rem; /* text-7xl */
  line-height: 0.4;
  color: var(--espero-golddark);
}
.es-quote-text blockquote {
  margin: 0;
  padding: 0;
  border: 0;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: clamp(1.4rem, 2.8vw, 2.1rem);
  line-height: 1.375;
  color: var(--espero-ink);
}
.es-quote-text figcaption {
  font-size: 12px;
  line-height: 1.5;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--espero-inkmuted);
}