/* V5 — Sagroth2 inner-world atmosphere.
   Keeps the functional V4 surfaces and replaces the flat wine/charcoal field. */

.inner-page-shell {
  isolation: isolate;
  background:
    linear-gradient(90deg, rgba(8, 9, 9, .96) 0%, rgba(10, 11, 11, .90) 35%, rgba(12, 12, 11, .78) 68%, rgba(10, 10, 9, .88) 100%),
    linear-gradient(180deg, rgba(8, 8, 8, .36) 0%, rgba(8, 8, 8, .68) 70%, #080909 100%),
    url("../img/sagroth-journey-v1.png") 68% top / cover fixed no-repeat;
}

.inner-page-shell::before {
  z-index: -1;
  opacity: 1;
  background:
    radial-gradient(ellipse at 72% 18%, rgba(184, 139, 72, .10), transparent 28%),
    radial-gradient(ellipse at 38% 48%, transparent 0 32%, rgba(0, 0, 0, .30) 76%),
    linear-gradient(180deg, transparent 0 42%, rgba(6, 7, 7, .72) 92%);
  filter: none;
  mask-image: none;
}

.inner-page-shell::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  opacity: .22;
  background-image:
    repeating-linear-gradient(0deg, rgba(255,255,255,.012) 0 1px, transparent 1px 4px),
    linear-gradient(90deg, transparent 0 12%, rgba(206, 165, 91, .055) 50%, transparent 88%);
}

.inner-page-hero {
  background:
    linear-gradient(90deg, rgba(8, 9, 9, .92), rgba(15, 14, 12, .76) 66%, rgba(24, 20, 15, .48));
  border-bottom-color: rgba(184, 146, 77, .28);
  box-shadow: 0 22px 50px rgba(0, 0, 0, .18);
}

.inner-page-hero::after {
  opacity: .14;
  filter: sepia(.35) saturate(.72);
}

.inner-page-body {
  background: linear-gradient(180deg, rgba(9, 10, 10, .20), rgba(8, 9, 9, .72));
}

@media (max-width: 900px) {
  .inner-page-shell {
    background:
      linear-gradient(180deg, rgba(8, 9, 9, .88), rgba(8, 9, 9, .96)),
      url("../img/sagroth-journey-v1.png") 69% top / auto 720px scroll no-repeat;
  }
  .inner-page-shell::before {
    background: linear-gradient(180deg, transparent, rgba(6, 7, 7, .76) 74%);
  }
}

@media (prefers-reduced-motion: reduce) {
  .inner-page-shell { background-attachment: scroll; }
}
