/* Marcellus pour l'identité, Cormorant Garamond pour les documents. */
body { font-family: "Cormorant Garamond", serif; }

.identity strong,
.nav span,
h1,
.entry-title h2,
.folio h2,
.codex-content h3,
.inscribed-code .motto,
.oath small {
  font-family: Marcellus, serif;
  font-weight: 400;
  letter-spacing: .015em;
}

.intro h1 em, .folio-subtitle, .gate-side { font-family: "Cormorant Garamond", serif; }
.intro p, .entry p, .codex-content > p, .pillars p, .mission-grid p,
.combat-section p, .loadout p, .history-line p { font-size: 1.06rem; }

/* Ouverture sans séparation centrale, avec ornements latéraux. */
.gateway {
  background: radial-gradient(circle at 50% 46%, #30272c 0, #171419 34%, #09090b 69%, #050506);
  color: #eee7de;
}

.door {
  width: 50%;
  background: linear-gradient(90deg, #0d0d10, #21191e 72%, #2e1b20);
  box-shadow: inset 0 0 100px rgba(0,0,0,.78);
}
.door-right { background: linear-gradient(-90deg, #0d0d10, #21191e 72%, #2e1b20); }
.door::after, .gateway-glow { display: none; }
.door::before {
  inset: 22px;
  border-color: #49383d;
  background: linear-gradient(90deg, rgba(182,55,70,.08), transparent 18%),
    repeating-linear-gradient(135deg, transparent 0 52px, rgba(188,84,99,.045) 53px 54px);
}
.door-right::before {
  background: linear-gradient(-90deg, rgba(182,55,70,.08), transparent 18%),
    repeating-linear-gradient(45deg, transparent 0 52px, rgba(188,84,99,.045) 53px 54px);
}
.door-runes {
  width: 54px;
  padding: 24px 0;
  color: #a84450;
  border-top: 1px solid #71303a;
  border-bottom: 1px solid #71303a;
  font-family: Marcellus, serif;
  font-size: 1.05rem;
  line-height: 2.65;
  text-shadow: 0 0 18px rgba(215,60,78,.7);
}
.door-left .door-runes { left: 8%; right: auto; }
.door-right .door-runes { right: 8%; left: auto; }
.door-runes::before, .door-runes::after {
  content: "◆";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  color: #6e2a34;
  font-size: .55rem;
}
.door-runes::before { top: -8px; }
.door-runes::after { bottom: -8px; }

.threshold { width: min(1240px, 88vw); }
.gate-heading { text-align: center; margin-bottom: 64px; }
.gate-heading small {
  font-family: "Saira Condensed", sans-serif;
  font-size: .72rem;
  letter-spacing: .4em;
  color: #b1a5a8;
}
.gate-heading h1 {
  font-family: Marcellus, serif;
  font-size: clamp(2.8rem, 5.5vw, 5.2rem);
  margin: 18px 0 0;
  text-transform: none;
  letter-spacing: .015em;
  color: #f1e9df;
  text-shadow: 0 3px 35px rgba(212,67,81,.2);
}
.gate-heading h1 em { font-family: Marcellus, serif; color: #c54b57; }
.threshold-layout {
  width: 100%;
  display: grid;
  grid-template-columns: minmax(230px,1fr) 160px minmax(230px,1fr);
  align-items: center;
  gap: clamp(72px, 9vw, 150px);
}
.gate-side small {
  display: block;
  font-family: "Saira Condensed", sans-serif;
  font-size: .66rem;
  letter-spacing: .3em;
  color: #aa747b;
  margin-bottom: 13px;
}
.gate-side p { font-size: 1.3rem; line-height: 1.55; color: #d1c6c2; margin: 0; font-style: italic; }
.gate-left { text-align: right; }
.gate-right { text-align: left; }
.threshold-seal {
  width: 148px;
  height: 148px;
  background: radial-gradient(circle, #541e27 0, #241319 40%, #0b0a0c 70%);
  border-color: #ca4b58;
  box-shadow: 0 0 0 9px rgba(150,53,66,.14), 0 0 70px rgba(205,54,70,.32);
}
.inner-rune { font-family: Marcellus, serif; color: #e2717a; text-shadow: 0 0 24px #de3b4a; }
.outer-ring { border-color: #a44952; }

/* Accueil illustré. */
.intro { isolation: isolate; background: #080809; }
.intro::before {
  content: "";
  position: absolute;
  z-index: -2;
  inset: 0;
  background-image: linear-gradient(90deg, rgba(5,5,6,.98) 0%, rgba(5,5,6,.78) 38%, rgba(5,5,6,.24) 72%, rgba(5,5,6,.14) 100%),
    linear-gradient(0deg, #080809 0%, transparent 38%), url("assets/presentation-comic.webp");
  background-size: cover;
  background-position: center;
}
.intro::after { z-index: -1; }
.intro h1, .intro p, .intro .chapter, .intro .home-sigil {
  align-self: flex-start;
  text-align: left;
  margin-left: max(0px, calc((100vw - 1160px)/2));
}
.intro .chapter { justify-content: flex-start; }
.intro h1, .intro h1 em { font-family: Marcellus, serif; }
.intro h1 { letter-spacing: .01em; }
.home-sigil { background: rgba(7,7,8,.62); backdrop-filter: blur(4px); }

/* Une illustration comics pour chaque entrée. */
.codex-visual {
  position: relative;
  margin: 0 0 38px;
  border: 1px solid #392e31;
  background: #09090a;
  overflow: hidden;
}
.codex-visual::after {
  content: "";
  position: absolute;
  inset: 0;
  box-shadow: inset 0 0 60px #050506;
  pointer-events: none;
}
.codex-visual img {
  display: block;
  width: 100%;
  height: 285px;
  object-fit: cover;
  filter: saturate(.82) contrast(1.05);
}
.codex-visual figcaption {
  position: absolute;
  z-index: 2;
  left: 16px;
  bottom: 13px;
  padding: 5px 9px;
  background: rgba(5,5,6,.78);
  color: #b4a6a7;
  font-family: "Saira Condensed", sans-serif;
  font-size: .62rem;
  letter-spacing: .15em;
}
.entry-title h2 { font-size: 1.15rem; }
.folio h2 { font-family: Marcellus, serif; }
.code-lines li, .oath p { font-family: "Cormorant Garamond", serif; }

/* Aucun axe décoratif ne traverse les textes. */
.intro::after,
.folio::before { display: none !important; }

.document-section {
  position: relative;
  max-width: 780px;
  margin: 0 auto;
  padding: clamp(26px, 4vw, 48px);
  border: 1px solid #332d2f;
  background: linear-gradient(145deg, rgba(31,24,27,.7), rgba(10,10,11,.72));
}
.document-section::before {
  content: "";
  position: absolute;
  left: 0;
  top: 28px;
  bottom: 28px;
  width: 2px;
  background: #79212a;
}
.document-section h3 { margin-top: 0; font-size: 1.35rem; color: #ddd3c7; }
.document-section p { font-size: 1.12rem; line-height: 1.75; color: #a69c98; }
.document-section p:last-child { margin-bottom: 0; }
.document-number {
  display: block;
  margin-bottom: 14px;
  color: #8f2d36;
  font-family: Marcellus, serif;
  font-size: .76rem;
  letter-spacing: .2em;
}
.entry-mark span { font-size: .6rem; }

.catalogue-actions { display: flex; align-items: center; gap: 22px; }
.catalogue-actions button[hidden] { display: none; }
#backBtn { color: #a9454e; }

.entries.categories-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
}
.category-card {
  position: relative;
  min-height: 290px;
  border: 1px solid #342c2f;
  background: #09090a;
  overflow: hidden;
  cursor: pointer;
  transition: transform .25s, border-color .25s, box-shadow .25s;
}
.category-card::before {
  content: "";
  position: absolute;
  z-index: 3;
  left: 0;
  top: 0;
  bottom: 0;
  width: 2px;
  background: linear-gradient(transparent, #a52c38 20%, #a52c38 80%, transparent);
  opacity: .65;
}
.category-card:hover,
.category-card:focus-visible {
  transform: translateY(-5px);
  border-color: #674047;
  box-shadow: 0 24px 50px rgba(0,0,0,.38);
  outline: none;
}
.category-card img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(.68) brightness(.6) contrast(1.08);
  transition: transform .5s, filter .35s;
}
.category-card:hover img { transform: scale(1.035); filter: saturate(.8) brightness(.68) contrast(1.08); }
.category-shade {
  position: absolute;
  z-index: 1;
  inset: 0;
  background: linear-gradient(90deg, rgba(6,6,7,.97) 0%, rgba(6,6,7,.82) 48%, rgba(6,6,7,.25) 100%),
    linear-gradient(0deg, rgba(6,6,7,.84), transparent 65%);
}
.category-copy {
  position: absolute;
  z-index: 2;
  left: clamp(25px, 4vw, 42px);
  right: 34%;
  bottom: 32px;
}
.category-copy small {
  color: #b04a54;
  font-family: "Saira Condensed", sans-serif;
  font-size: .66rem;
  letter-spacing: .18em;
}
.category-copy h2 {
  margin: 10px 0 11px;
  color: #eee4d8;
  font-family: Marcellus, serif;
  font-size: clamp(1.35rem, 2.2vw, 2rem);
  font-weight: 400;
}
.category-copy p {
  margin: 0 0 22px;
  color: #b0a6a2;
  font-size: 1.02rem;
  line-height: 1.42;
}
.category-copy b {
  color: #a29896;
  font-family: "Saira Condensed", sans-serif;
  font-size: .65rem;
  font-weight: 500;
  letter-spacing: .17em;
}
.category-mark {
  position: absolute;
  z-index: 2;
  right: 24px;
  top: 19px;
  color: rgba(255,255,255,.2);
  font-family: Marcellus, serif;
  font-size: 2.3rem;
}

@media (max-width: 780px) {
  .gate-heading { margin-bottom: 34px; }
  .threshold-layout { grid-template-columns: 1fr; gap: 26px; }
  .gate-side { text-align: center; }
  .gate-left { order: 2; }
  .threshold-seal { order: 1; margin: auto; }
  .gate-right { order: 3; }
  .gate-left p { display: none; }
  .gate-right small { display: none; }
  .gate-right p { font-size: 1rem; }
  .door-runes { display: none; }
  .intro::before {
    background-image: linear-gradient(90deg, rgba(5,5,6,.96), rgba(5,5,6,.56)),
      linear-gradient(0deg, #080809, transparent), url("assets/presentation-comic.webp");
    background-position: 62% center;
  }
  .intro h1, .intro p, .intro .chapter, .intro .home-sigil { margin-left: 0; }
  .codex-visual img { height: 210px; }
  .entries.categories-grid { grid-template-columns: 1fr; }
  .category-card { min-height: 245px; }
  .category-copy { right: 22%; }
}
