#mc_embed_signup {
  overflow: hidden;
  margin: 0 0 0 auto;
  font-family: monospace;
  display: block;
  width: 100%;
  max-width: 576px;
}
#mc_embed_signup p {
  margin-bottom: 24px;
}
@media (max-width: 768px) {
  #mc_embed_signup {
    width: 100%;
  }
}

.mc-field-group {
  font-family: "Courier Prime", monospace;
  display: flex;
  width: 100%;
  flex-direction: column;
  position: relative;
}

.input-button-wrapper {
  display: flex;
  width: 100%;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
}

label {
  font-size: 14px;
  color: #63200c;
  margin-bottom: 5px;
}

input#mce-EMAIL {
  height: 62px;
  color: #393939;
  padding: 0 12px;
  border: 1px solid #393939;
  border-radius: 6px 0 0 6px;
  margin-bottom: 0;
  background: rgba(255, 246, 247, 0.5);
  flex: 1;
  border-right: none;
  font-family: "Courier Prime", monospace;
  text-align: left;
}
@media (max-width: 768px) {
  input#mce-EMAIL {
    font-size: 18px;
  }
}
@media (min-width: 768px) and (max-width: 1440px) {
  input#mce-EMAIL {
    font-size: 18px;
  }
}
@media (min-width: 1441px) {
  input#mce-EMAIL {
    font-size: 24px;
  }
}
input#mce-EMAIL.mce_inline_error {
  border-color: #63200c !important;
}
@media (min-width: 768px) and (max-width: 1440px) {
  input#mce-EMAIL {
    height: 52px;
  }
}
@media (max-width: 768px) {
  input#mce-EMAIL {
    width: 50px;
    height: 52px;
  }
}

input#mce-EMAIL::placeholder {
  color: #989898;
}

#mc-embedded-subscribe {
  font-family: "Courier Prime", monospace;
  text-transform: uppercase;
  background-color: #393939;
  color: #FFF6F7;
  margin: 0;
  padding: 0;
  height: 62px;
  width: auto;
  padding: 0 12px;
  min-width: 96px;
  border: 1px solid #393939;
  border-radius: 0 6px 6px 0;
  transition: all 0.3s ease;
  cursor: pointer;
}
@media (max-width: 768px) {
  #mc-embedded-subscribe {
    font-size: 18px;
  }
}
@media (min-width: 768px) and (max-width: 1440px) {
  #mc-embedded-subscribe {
    font-size: 18px;
  }
}
@media (min-width: 1441px) {
  #mc-embedded-subscribe {
    font-size: 24px;
  }
}
@media (min-width: 768px) and (max-width: 1440px) {
  #mc-embedded-subscribe {
    height: 52px;
  }
}
@media (max-width: 768px) {
  #mc-embedded-subscribe {
    height: 52px;
  }
}

#mc-embedded-subscribe:hover {
  background-color: #000000;
}

/* Standard error and success responses */
#mce-error-response,
#mce-success-response {
  width: 100%;
  border-radius: 6px;
  font-family: "Courier Prime", monospace;
  font-size: 14px;
}

#mce-error-response {
  color: #fff;
  background-color: #63200c;
  font-weight: normal !important;
}

#mce-success-response {
  background-color: rgba(255, 246, 247, 0.5);
  color: #393939;
  padding: 12px;
  text-align: center;
}

/* Move responses below input field */
#mce-responses {
  width: 100%;
  margin-top: 12px;
}

#mc_embed_signup div.mce_inline_error {
  margin: 0 !important;
  text-align: center;
}

/* Fix for Mailchimp's auto-injected error class */
.mc-field-group div.mce_inline_error {
  width: 100%;
  font-weight: normal !important;
  padding: 10px !important;
  color: #fff !important;
  font-family: "Courier Prime", monospace;
  background-color: #63200c !important;
  border-radius: 6px;
  order: 1;
}
@media (max-width: 768px) {
  .mc-field-group div.mce_inline_error {
    font-size: 9px;
  }
}
@media (min-width: 768px) and (max-width: 1440px) {
  .mc-field-group div.mce_inline_error {
    font-size: 9px;
  }
}
@media (min-width: 1441px) {
  .mc-field-group div.mce_inline_error {
    font-size: 12px;
  }
}

/* When error is present, style input and button while preserving layout */
.mc-field-group input.mce_inline_error {
  border-color: #63200c !important;
}

/* Apply red border to button when input has error */
input.mce_inline_error ~ #mc-embedded-subscribe {
  border-color: #63200c !important;
}

/* Handle Mailchimp's dynamically injected error message */
.mc-field-group > .mce_inline_error {
  order: 2;
}

/* Fix for Mailchimp direct injection of error div after the input (before button) */
#mce-EMAIL + div.mce_inline_error {
  position: absolute;
  top: 100%;
  width: 100%;
  left: 0;
}

/* Additional fix for Mailchimp error handling */
.mc-field-group > div.mce_inline_error {
  position: absolute;
  top: 100%;
  left: 0;
  margin-top: 5px !important;
}

/* Preserve layout by forcing the inline-error message to display below without affecting other elements */
.input-button-wrapper input.mce_inline_error {
  margin-bottom: 0 !important;
}

@font-face {
  font-family: "grobe_deutschmeisterregular";
  src: url("../fonts/grobedeutschmeister-webfont.woff2") format("woff2"), url("../fonts/grobedeutschmeister-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}
.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: "Courier Prime", monospace;
  line-height: 1.5;
  color: #393939;
  background-color: #FFF6F7;
  padding: 96px 0 0;
}
@media (max-width: 768px) {
  body {
    font-size: 18px;
  }
}
@media (min-width: 768px) and (max-width: 1440px) {
  body {
    font-size: 18px;
  }
}
@media (min-width: 1441px) {
  body {
    font-size: 24px;
  }
}

main {
  max-width: 1920px;
  width: 100%;
  min-width: 100%;
  margin: 0 auto;
  padding: 0;
  position: relative;
  display: block;
}

a {
  color: #393939;
  text-decoration: none;
  transition: color 0.3s ease;
}
a:hover {
  color: #000000;
}

nav {
  position: fixed;
  top: 96px;
  right: 96px;
  z-index: 9999;
  font-family: "Courier Prime", monospace;
}
@media (min-width: 768px) and (max-width: 1440px) {
  nav {
    top: 48px;
    right: 48px;
  }
}
nav .menu-toggle {
  display: none;
}
nav .hamburger {
  display: none;
  cursor: pointer;
  padding: 10px;
  z-index: 1001;
}
nav .hamburger span {
  display: block;
  width: 25px;
  height: 2px;
  background-color: #393939;
  margin: 5px 0;
  transition: all 0.3s ease;
}
nav .close-button {
  display: none;
  cursor: pointer;
  padding: 10px;
  z-index: 1001;
  position: fixed;
  top: 12px;
  right: 12px;
  width: 35px;
  height: 35px;
}
nav .close-button span {
  display: block;
  width: 25px;
  height: 2px;
  background-color: #393939;
  margin: 5px 0;
  transition: all 0.3s ease;
  position: absolute;
  top: 50%;
  left: 50%;
  margin: 0;
}
nav .close-button span:first-child {
  transform: translate(-50%, -50%) rotate(45deg);
}
nav .close-button span:last-child {
  transform: translate(-50%, -50%) rotate(-45deg);
}
nav ul {
  list-style: none;
  padding: 0;
  margin: 0;
  text-align: right;
}
nav ul li {
  margin-bottom: 0;
}
nav ul li a {
  color: #393939;
  text-decoration: none;
  transition: all 0.3s ease;
  display: inline-block !important;
  background: #FFF6F7;
  line-height: 1;
}
@media (max-width: 768px) {
  nav ul li a {
    font-size: 18px;
  }
}
@media (min-width: 768px) and (max-width: 1440px) {
  nav ul li a {
    font-size: 18px;
  }
}
@media (min-width: 1441px) {
  nav ul li a {
    font-size: 24px;
  }
}
nav ul li a img {
  width: 20px;
  height: 20px;
  margin-right: 4px;
  margin-bottom: -3px;
}
@media (min-width: 768px) and (max-width: 1440px) {
  nav ul li a img {
    width: 14px;
    height: 14px;
    margin-right: 4px;
    margin-bottom: -2px;
  }
}
@media (max-width: 768px) {
  nav ul li a img {
    width: 24px;
    height: 24px;
    margin-bottom: -4px;
    margin-right: 9px;
  }
}
nav .menu-toggle:checked ~ .hamburger {
  display: none;
}
nav .menu-toggle:checked ~ .close-button {
  display: block;
}

.site-logo.fixed {
  position: fixed;
  top: 96px;
  left: 96px;
  width: 288px;
  z-index: 99;
  background-color: #FFF6F7;
  padding: 12px;
  transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  line-height: 0;
  margin: 0;
}
.site-logo.fixed:hover {
  background-color: #393939;
}
.site-logo.fixed:hover img {
  filter: brightness(0) invert(1);
}
.site-logo.fixed a {
  display: block;
  line-height: 0;
}
.site-logo.fixed img {
  width: 100%;
  height: auto;
  display: block;
  transition: filter 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}
@media (min-width: 768px) and (max-width: 1440px) {
  .site-logo.fixed {
    top: 48px;
    left: 48px;
  }
}
@media (max-width: 768px) {
  .site-logo.fixed {
    width: 100%;
    top: 0;
    left: 0;
    padding-right: 144px;
  }
}

.header {
  width: 100%;
  min-height: max(768px, 100vh);
  background-image: url("/images/paint-background.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  background-position: top center;
  background-position-y: 264px;
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1366px) and (orientation: portrait) {
  .header {
    min-height: 60vh;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1366px) and (orientation: landscape) {
  .header {
    min-height: 100vh;
  }
}
@media only screen and (min-device-width: 820px) and (max-device-width: 1180px) and (orientation: portrait) {
  .header {
    min-height: 50vh;
  }
}
@media only screen and (min-device-width: 820px) and (max-device-width: 1180px) and (orientation: landscape) {
  .header {
    min-height: 100vh;
  }
}
@media (max-width: 768px) {
  .header {
    background-position-y: 168px;
    min-height: calc(100vh - 96px);
  }
}
.header-intro {
  max-width: 678px;
  text-align: right;
  margin: 0 auto;
}
@media (max-width: 768px) {
  .header-intro {
    max-width: calc(100vw - 48px);
    margin-top: 96px;
  }
}
.header-intro .logo-container {
  height: auto;
  display: inline-block;
  width: 100% !important;
  line-height: 0;
  margin: 0;
  padding: 0;
}
@media (max-width: 768px) {
  .header-intro .logo-container {
    width: 100%;
  }
}
.header-intro .main-logo {
  display: inline-block;
  line-height: 0;
  margin: 0;
  padding: 0;
}
.header-intro .main-logo.can-transition {
  transition-property: transform, top, left, width, padding, background-color;
  transition-duration: 0.5s;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}
.header-intro .main-logo.state-normal {
  position: relative;
  top: auto;
  left: auto;
  width: auto;
  transform: none;
  background-color: transparent;
  padding: 0;
  z-index: 1;
}
.header-intro .main-logo.state-fixed {
  position: fixed;
  top: 96px;
  left: 96px;
  width: 288px;
  z-index: 99;
  background-color: #FFF6F7;
  padding: 12px;
}
.header-intro .main-logo.state-fixed:hover {
  background-color: #393939;
}
.header-intro .main-logo.state-fixed:hover img {
  filter: brightness(0) invert(1);
}
@media (min-width: 768px) and (max-width: 1440px) {
  .header-intro .main-logo.state-fixed {
    top: 48px;
    left: 48px;
  }
}
@media (max-width: 768px) {
  .header-intro .main-logo.state-fixed {
    width: 100%;
    top: 0;
    left: 0;
    padding-right: 144px;
  }
}
.header-intro .main-logo a {
  display: block;
  line-height: 0;
}
.header-intro .main-logo img {
  width: 100%;
  height: auto;
  display: block;
  transition: filter 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.author {
  font-family: "grobe_deutschmeisterregular", serif;
  font-weight: 400;
  line-height: 1.5;
  color: #442B20;
  margin-top: 48px;
  display: block;
}
@media (max-width: 768px) {
  .author {
    font-size: 27px;
  }
}
@media (min-width: 768px) and (max-width: 1440px) {
  .author {
    font-size: 27px;
  }
}
@media (min-width: 1441px) {
  .author {
    font-size: 36px;
  }
}
@media (max-width: 768px) {
  .author {
    margin-top: 24px;
    font-size: 21px;
  }
}

.header-image {
  max-width: 1000px;
  width: 100%;
  height: auto;
  margin: 0 auto;
  margin-top: -48px;
  overflow: hidden;
}
.header-image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
@media (max-width: 768px) {
  .header-image img {
    width: 200%;
    position: relative;
    left: -50%;
  }
}

.intro {
  position: relative;
  max-width: none;
  margin: 0 auto;
  padding: 0;
  top: -288px;
  height: 140vh;
  background-image: url("/images/unknown-soldier-main3.png");
  background-size: 130vh;
  background-repeat: no-repeat;
  background-position: left top;
  display: flex;
  justify-content: flex-end;
}
@media (min-width: 768px) and (max-width: 1440px) {
  .intro {
    max-width: none;
    top: -13vw;
    background-size: 65vw;
    height: 150vh;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1366px) and (orientation: landscape) {
  .intro {
    max-width: none;
    top: -480px;
    background-size: 65vw;
    height: 80vh;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1366px) and (orientation: portrait) {
  .intro {
    height: 75vh;
    top: -192px;
  }
}
@media only screen and (min-device-width: 820px) and (max-device-width: 1180px) and (orientation: portrait) {
  .intro {
    height: 75vh;
  }
}
@media only screen and (min-device-width: 820px) and (max-device-width: 1180px) and (orientation: landscape) {
  .intro {
    top: -192px;
    height: 130vh;
  }
}
@media (max-width: 768px) {
  .intro {
    flex-direction: column;
    background-size: 120vh;
    height: min(120vh, 900px);
    top: -20vh;
    max-width: none;
    background-position: center top;
    background-size: 150%;
    padding-top: calc(100% + 48px);
    min-height: auto;
  }
}
.intro-text {
  width: 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-family: "Courier Prime", monospace;
  line-height: 1.5;
  color: #393939;
  text-align: justify;
  padding: 0 384px 0 0;
  margin-top: 0;
}
@media (max-width: 768px) {
  .intro-text {
    font-size: 18px;
  }
}
@media (min-width: 768px) and (max-width: 1440px) {
  .intro-text {
    font-size: 18px;
  }
}
@media (min-width: 1441px) {
  .intro-text {
    font-size: 24px;
  }
}
@media (max-width: 1536px) {
  .intro-text {
    padding: 0 192px 0 0;
  }
}
@media (max-width: 1370px) {
  .intro-text {
    padding: 0 144px 0 96px;
    margin-top: -288px;
  }
}
@media (max-width: 1100px) {
  .intro-text {
    padding: 0 144px 0 0;
  }
}
@media (max-width: 900px) {
  .intro-text {
    padding: 0 48px;
  }
}
@media (max-width: 768px) {
  .intro-text {
    width: 100%;
    margin: 0;
    padding: 0 24px;
    background: none;
  }
}
.intro-text p {
  margin-bottom: 0;
}
@media (max-width: 768px) {
  .intro-text p {
    text-align: justify;
  }
}

.cta-button {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  padding: 24px;
  margin-top: 48px;
  border: 1px solid #393939;
  border-radius: 6px;
  font-family: "Courier Prime", monospace;
  color: #393939;
  text-decoration: none;
  background-color: rgba(255, 246, 247, 0.8);
  transition: background-color 0.3s ease;
}
@media (max-width: 768px) {
  .cta-button {
    font-size: 18px;
  }
}
@media (min-width: 768px) and (max-width: 1440px) {
  .cta-button {
    font-size: 18px;
  }
}
@media (min-width: 1441px) {
  .cta-button {
    font-size: 24px;
  }
}
.cta-button:hover {
  background-color: rgba(235, 227, 228, 0.9);
}
.cta-button img {
  width: 24px;
  height: 24px;
  margin-right: 12px;
  margin-bottom: 2px;
}
@media (max-width: 768px) {
  .cta-button {
    margin-top: 24px;
    padding: 24px;
  }
}

.characters-section, .worlds-section, .lore-section {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  margin: 96px auto 0;
}
@media (max-width: 768px) {
  .characters-section, .worlds-section, .lore-section {
    grid-template-columns: repeat(1, 1fr);
  }
}

.character-card, .world-card, .lore-card {
  position: relative;
  overflow: hidden;
  border: 1px solid #393939;
  border-right: none;
  border-bottom: none;
  padding: 0;
  cursor: default;
  height: 480px;
}
.character-card:last-of-type, .world-card:last-of-type, .lore-card:last-of-type {
  border-right: 1px solid #393939;
}
@media (max-width: 768px) {
  .character-card, .world-card, .lore-card {
    display: flex;
    flex-direction: column;
    height: auto;
    border: none;
  }
}
@media (min-width: 768px) and (max-width: 1440px) {
  .character-card, .world-card, .lore-card {
    height: 25vw;
  }
}
.character-card.redacted, .world-card.redacted, .lore-card.redacted {
  cursor: url("/images/cursor.png"), auto;
}
.character-card.heading, .character-card.view-all, .world-card.heading, .world-card.view-all, .lore-card.heading, .lore-card.view-all {
  background-color: #393939;
  color: #FFF6F7;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}
@media (max-width: 768px) {
  .character-card.heading.heading, .character-card.view-all.heading, .world-card.heading.heading, .world-card.view-all.heading, .lore-card.heading.heading, .lore-card.view-all.heading {
    padding: 24px;
    height: auto;
  }
}
@media (max-width: 768px) {
  .character-card.heading.view-all, .character-card.view-all.view-all, .world-card.heading.view-all, .world-card.view-all.view-all, .lore-card.heading.view-all, .lore-card.view-all.view-all {
    background-color: transparent;
    border: none !important;
  }
}
.character-card.heading.view-all a, .character-card.view-all.view-all a, .world-card.heading.view-all a, .world-card.view-all.view-all a, .lore-card.heading.view-all a, .lore-card.view-all.view-all a {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  width: 100%;
  background-color: #393939;
  color: #FFF6F7;
  text-align: center;
  transition: background-color 0.3s ease;
}
.character-card.heading.view-all a:hover, .character-card.view-all.view-all a:hover, .world-card.heading.view-all a:hover, .world-card.view-all.view-all a:hover, .lore-card.heading.view-all a:hover, .lore-card.view-all.view-all a:hover {
  background-color: #000000;
}
.character-card.heading.view-all a img, .character-card.view-all.view-all a img, .world-card.heading.view-all a img, .world-card.view-all.view-all a img, .lore-card.heading.view-all a img, .lore-card.view-all.view-all a img {
  display: none;
}
@media (max-width: 768px) {
  .character-card.heading.view-all a, .character-card.view-all.view-all a, .world-card.heading.view-all a, .world-card.view-all.view-all a, .lore-card.heading.view-all a, .lore-card.view-all.view-all a {
    padding: 12px;
    margin: 24px;
    width: auto;
    border-radius: 10px;
    background: transparent;
    border: 1px solid #393939;
    color: #393939;
  }
  .character-card.heading.view-all a img, .character-card.view-all.view-all a img, .world-card.heading.view-all a img, .world-card.view-all.view-all a img, .lore-card.heading.view-all a img, .lore-card.view-all.view-all a img {
    display: block;
    height: 24px;
    width: 24px;
    margin-right: 12px;
  }
}
.character-card.heading h3, .character-card.view-all h3, .world-card.heading h3, .world-card.view-all h3, .lore-card.heading h3, .lore-card.view-all h3 {
  font-weight: normal;
  margin-bottom: 8px;
}
@media (max-width: 768px) {
  .character-card.heading h3, .character-card.view-all h3, .world-card.heading h3, .world-card.view-all h3, .lore-card.heading h3, .lore-card.view-all h3 {
    font-size: 27px;
  }
}
@media (min-width: 768px) and (max-width: 1440px) {
  .character-card.heading h3, .character-card.view-all h3, .world-card.heading h3, .world-card.view-all h3, .lore-card.heading h3, .lore-card.view-all h3 {
    font-size: 27px;
  }
}
@media (min-width: 1441px) {
  .character-card.heading h3, .character-card.view-all h3, .world-card.heading h3, .world-card.view-all h3, .lore-card.heading h3, .lore-card.view-all h3 {
    font-size: 36px;
  }
}
.character-card.heading h4, .character-card.view-all h4, .world-card.heading h4, .world-card.view-all h4, .lore-card.heading h4, .lore-card.view-all h4 {
  font-weight: normal;
}
@media (max-width: 768px) {
  .character-card.heading h4, .character-card.view-all h4, .world-card.heading h4, .world-card.view-all h4, .lore-card.heading h4, .lore-card.view-all h4 {
    font-size: 18px;
  }
}
@media (min-width: 768px) and (max-width: 1440px) {
  .character-card.heading h4, .character-card.view-all h4, .world-card.heading h4, .world-card.view-all h4, .lore-card.heading h4, .lore-card.view-all h4 {
    font-size: 18px;
  }
}
@media (min-width: 1441px) {
  .character-card.heading h4, .character-card.view-all h4, .world-card.heading h4, .world-card.view-all h4, .lore-card.heading h4, .lore-card.view-all h4 {
    font-size: 24px;
  }
}
.character-card img, .world-card img, .lore-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s ease;
}
.character-card.redacted p, .character-card.redacted h5 span, .character-card.redacted h6, .world-card.redacted p, .world-card.redacted h5 span, .world-card.redacted h6, .lore-card.redacted p, .lore-card.redacted h5 span, .lore-card.redacted h6 {
  text-decoration: line-through;
  position: relative;
}
.character-card.redacted.copy h5 span, .world-card.redacted.copy h5 span, .lore-card.redacted.copy h5 span {
  text-decoration: none !important;
}
.character-card.redacted h5::before, .world-card.redacted h5::before, .lore-card.redacted h5::before {
  content: "*** REDACTED ***";
  position: relative;
  text-align: center;
  width: 100%;
  display: block;
  font-weight: normal;
  text-decoration: none !important;
  margin-bottom: 12px;
}
@media (max-width: 768px) {
  .character-card.redacted h5::before, .world-card.redacted h5::before, .lore-card.redacted h5::before {
    font-size: 13.5px;
  }
}
@media (min-width: 768px) and (max-width: 1440px) {
  .character-card.redacted h5::before, .world-card.redacted h5::before, .lore-card.redacted h5::before {
    font-size: 13.5px;
  }
}
@media (min-width: 1441px) {
  .character-card.redacted h5::before, .world-card.redacted h5::before, .lore-card.redacted h5::before {
    font-size: 18px;
  }
}

.characters-section .character-card:nth-child(4n) {
  border-right: 1px solid #393939;
}
.characters-section .character-card:nth-last-child(-n+4) {
  border-bottom: 1px solid #393939;
}

.worlds-section .world-card:not(.heading) {
  grid-column: span 2;
}
.worlds-section .world-card:not(.heading):nth-child(2) {
  grid-column: span 3;
}
.worlds-section .world-card:not(.heading).view-all {
  grid-column: span 1;
}
.worlds-section .world-card:not(.heading):nth-child(2n+3), .worlds-section .world-card:not(.heading):last-child {
  border-right: 1px solid #393939;
}
.worlds-section .world-card:not(.heading):nth-last-child(-n+2) {
  border-bottom: 1px solid #393939;
}
@media (max-width: 768px) {
  .worlds-section .world-card {
    grid-column: span 1 !important;
  }
}

body.is-homepage #characters {
  background: #FFF6F7;
  margin-top: -480px;
  position: relative;
  z-index: 3;
}
@media (max-width: 768px) {
  body.is-homepage #characters {
    margin-top: -192px;
  }
}
body.is-homepage .worlds-section .world-card:not(.heading):nth-last-child(2):not(.view-all) {
  grid-column: span 3;
}

.lore-section .lore-card:nth-child(4n), .lore-section .lore-card:last-child {
  border-right: 1px solid #393939;
}
.lore-section .lore-card:nth-last-child(-n+4) {
  border-bottom: 1px solid #393939;
}

.character-title, .world-title, .lore-title {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 48px;
  background-color: #393939;
  color: #FFF6F7;
  text-align: left;
  min-height: 480px;
}
.character-title h1, .world-title h1, .lore-title h1 {
  font-family: "Courier Prime", monospace;
  line-height: 1.2;
  margin-bottom: 6px;
}
@media (max-width: 768px) {
  .character-title h1, .world-title h1, .lore-title h1 {
    font-size: 27px;
  }
}
@media (min-width: 768px) and (max-width: 1440px) {
  .character-title h1, .world-title h1, .lore-title h1 {
    font-size: 27px;
  }
}
@media (min-width: 1441px) {
  .character-title h1, .world-title h1, .lore-title h1 {
    font-size: 36px;
  }
}
.character-title h2, .world-title h2, .lore-title h2 {
  font-family: "Courier Prime", monospace;
  line-height: 1.3;
  font-weight: normal;
}
@media (max-width: 768px) {
  .character-title h2, .world-title h2, .lore-title h2 {
    font-size: 18px;
  }
}
@media (min-width: 768px) and (max-width: 1440px) {
  .character-title h2, .world-title h2, .lore-title h2 {
    font-size: 18px;
  }
}
@media (min-width: 1441px) {
  .character-title h2, .world-title h2, .lore-title h2 {
    font-size: 24px;
  }
}

.character-info, .world-info, .lore-info {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 24px;
  background-color: #393939;
  color: #FFF6F7;
  display: flex;
  justify-content: center;
  align-items: left;
  flex-direction: column;
  opacity: 0;
  transition: opacity 0.5s ease;
  height: 480px;
}
@media (max-width: 768px) {
  .character-info, .world-info, .lore-info {
    position: static;
    opacity: 1;
    height: auto;
    transition: none;
  }
}
@media (min-width: 768px) and (max-width: 1440px) {
  .character-info, .world-info, .lore-info {
    height: 25vw;
  }
}

.character-card:hover .character-info, .world-card:hover .world-info, .lore-card:hover .lore-info {
  opacity: 0.95;
}

.character-card:hover img, .world-card:hover img, .lore-card:hover img {
  transform: scale(1.05);
}

.character-info h5, .character-info h6, .world-info h5, .world-info h6, .lore-info h5, .lore-info h6 {
  font-family: "Courier Prime", monospace;
  font-weight: normal;
  line-height: 1.5;
  text-transform: uppercase;
}
@media (max-width: 768px) {
  .character-info h5, .character-info h6, .world-info h5, .world-info h6, .lore-info h5, .lore-info h6 {
    font-size: 13.5px;
  }
}
@media (min-width: 768px) and (max-width: 1440px) {
  .character-info h5, .character-info h6, .world-info h5, .world-info h6, .lore-info h5, .lore-info h6 {
    font-size: 13.5px;
  }
}
@media (min-width: 1441px) {
  .character-info h5, .character-info h6, .world-info h5, .world-info h6, .lore-info h5, .lore-info h6 {
    font-size: 18px;
  }
}

.character-info h6, .world-info h6, .lore-info h6 {
  margin-top: 24px;
}

.character-info p, .world-info p, .lore-info p {
  font-family: "Courier Prime", monospace;
  line-height: 1.5;
  text-align: justify;
}
@media (max-width: 768px) {
  .character-info p, .world-info p, .lore-info p {
    font-size: 13.5px;
  }
}
@media (min-width: 768px) and (max-width: 1440px) {
  .character-info p, .world-info p, .lore-info p {
    font-size: 13.5px;
  }
}
@media (min-width: 1441px) {
  .character-info p, .world-info p, .lore-info p {
    font-size: 18px;
  }
}

.email-link, .content .email a, footer .email a {
  display: inline-flex;
  column-gap: 24px;
  margin-left: 0px;
  width: auto;
  padding: 12px 24px;
  background-color: transparent;
  border-radius: 6px;
  transition: background-color 0.3s ease;
  border: 1px solid #393939;
}
.email-link:hover, .content .email a:hover, footer .email a:hover {
  background-color: rgba(57, 57, 57, 0.1);
}
.email-link img, .content .email a img, footer .email a img {
  width: 14px;
  height: auto;
}

.phone a {
  display: inline-block;
  padding: 12px 24px;
  background-color: transparent;
  border-radius: 6px;
  transition: background-color 0.3s ease;
  border: 1px solid #393939;
  margin-left: 24px;
}
.phone a:hover {
  background-color: rgba(57, 57, 57, 0.1);
}
.phone a img {
  width: 14px;
  height: auto;
  margin-right: 24px;
}

footer {
  background-image: url("/images/paint-background.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  padding: 96px;
  text-align: center;
  margin-top: 96px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: auto auto;
  gap: 48px;
  align-items: start;
}
@media (max-width: 768px) {
  footer {
    padding: 48px 24px 24px;
  }
}
footer .email {
  grid-column: 1;
  grid-row: 1;
  text-align: justify;
}
footer #mc_embed_signup {
  grid-column: 2;
  grid-row: 1;
  text-align: right;
  justify-self: end;
}
footer .legion {
  grid-row: 3;
}
footer .legion img {
  width: auto;
  height: 192px;
  border-radius: 12px;
  opacity: 0.8;
  margin-bottom: 24px;
}
footer .subscribe {
  grid-row: 2;
  margin: 0 auto;
}
@media (max-width: 768px) and (max-width: 768px) {
  footer .subscribe h2 {
    font-size: 14.4px;
  }
}
@media (max-width: 768px) and (min-width: 768px) and (max-width: 1440px) {
  footer .subscribe h2 {
    font-size: 14.4px;
  }
}
@media (max-width: 768px) and (min-width: 1441px) {
  footer .subscribe h2 {
    font-size: 19.2px;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  footer .subscribe .subscribe-links a span {
    font-size: 14.4px;
  }
}
@media (max-width: 768px) and (min-width: 768px) and (max-width: 1440px) {
  footer .subscribe .subscribe-links a span {
    font-size: 14.4px;
  }
}
@media (max-width: 768px) and (min-width: 1441px) {
  footer .subscribe .subscribe-links a span {
    font-size: 19.2px;
  }
}
footer .subscribe .subscribe-links .youtube, footer .subscribe .subscribe-links .iheart-radio {
  background: rgba(255, 246, 247, 0.5);
}
footer .copyright, footer .legion, footer .subscribe {
  grid-column: 1/-1;
  text-align: center;
  margin-top: 96px;
  align-self: flex-end;
}
footer .copyright {
  grid-row: 4;
  margin-top: 48px;
}
@media (max-width: 768px) {
  footer {
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto;
    gap: 24px;
    min-height: calc(100vh - 48px);
    margin-top: 48px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }
  footer .email {
    grid-column: 1;
    grid-row: 1;
    text-align: center;
  }
  footer #mc_embed_signup {
    grid-column: 1;
    grid-row: 2;
    text-align: center;
    justify-self: center;
  }
  footer .subscribe {
    text-align: center;
    grid-row: 3;
  }
  footer .copyright {
    grid-row: 4;
    text-align: justify;
    margin-top: auto;
    align-self: flex-end;
  }
  footer .legion {
    text-align: center;
    width: 100%;
  }
  footer .legion p {
    text-align: center;
  }
}
footer p {
  font-family: "Courier Prime", monospace;
}
@media (max-width: 768px) {
  footer p {
    font-size: 18px;
  }
}
@media (min-width: 768px) and (max-width: 1440px) {
  footer p {
    font-size: 18px;
  }
}
@media (min-width: 1441px) {
  footer p {
    font-size: 24px;
  }
}
@media (max-width: 768px) {
  footer p {
    text-align: justify;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  footer p {
    font-size: 14.4px;
  }
}
@media (max-width: 768px) and (min-width: 768px) and (max-width: 1440px) {
  footer p {
    font-size: 14.4px;
  }
}
@media (max-width: 768px) and (min-width: 1441px) {
  footer p {
    font-size: 19.2px;
  }
}
@media (max-width: 768px) {
  footer p br {
    content: "";
  }
  footer p br:after {
    content: " ";
  }
}
footer .email a {
  margin-top: 24px;
  background-color: rgba(255, 246, 247, 0.5);
}

@media (max-width: 768px) {
  .characters-section, .lore-section {
    grid-template-columns: 1fr;
  }
  nav {
    position: fixed;
    top: 4px;
    right: 6px;
    padding: 0;
  }
  nav .hamburger {
    display: block;
  }
  nav .close-button {
    display: none;
  }
  nav ul {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #FFF6F7;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    transform: translateX(100%);
    transition: transform 0.3s ease;
    text-align: center;
  }
  nav ul li {
    margin: 20px 0;
  }
  nav ul li a {
    padding: 10px 20px;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  nav ul li a {
    font-size: 27px;
  }
}
@media (max-width: 768px) and (min-width: 768px) and (max-width: 1440px) {
  nav ul li a {
    font-size: 27px;
  }
}
@media (max-width: 768px) and (min-width: 1441px) {
  nav ul li a {
    font-size: 36px;
  }
}
@media (max-width: 768px) {
  nav .menu-toggle:checked ~ ul {
    transform: translateX(0);
  }
  body {
    padding: 0;
  }
}
main {
  overflow-x: hidden;
}

.content {
  max-width: calc(100vw - 384px);
  margin: 0 auto;
  padding: 0;
  position: relative;
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1366px) and (orientation: portrait) {
  .content {
    max-width: calc(100vw - 192px);
  }
}
@media only screen and (min-device-width: 820px) and (max-device-width: 1180px) and (orientation: portrait) {
  .content {
    max-width: none;
  }
}
@media (max-width: 768px) {
  .content {
    max-width: calc(100vw - 48px);
  }
}
.content.standalone {
  margin-top: 96px;
}
@media (max-width: 768px) {
  .content h3 {
    font-size: 18px;
  }
}
@media (min-width: 768px) and (max-width: 1440px) {
  .content h3 {
    font-size: 18px;
  }
}
@media (min-width: 1441px) {
  .content h3 {
    font-size: 24px;
  }
}
.content > div {
  margin: 0 auto 96px;
  max-width: min(100vw - 384px, 960px);
}
.content > div:last-child {
  margin-bottom: 0;
}
@media (min-width: 768px) and (max-width: 1440px) {
  .content > div {
    max-width: calc(100vw - 768px);
    min-width: 600px;
  }
}
@media (max-width: 768px) {
  .content > div {
    margin-bottom: 24px;
    max-width: none;
  }
}
@media (max-width: 768px) {
  .content .original-comic {
    width: 200%;
    position: relative;
    left: -50%;
  }
}
.content .two-column {
  display: flex;
  flex-direction: row;
  gap: 96px;
  align-items: center;
  max-width: min(100vw - 384px, 1344px);
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1366px) and (orientation: portrait) {
  .content .two-column {
    max-width: calc(100vw - 192px) !important;
  }
}
@media (max-width: 768px) {
  .content .two-column {
    flex-direction: column;
    gap: 24px;
    max-width: none;
  }
}
.content .two-column > div {
  flex: 1 0 0;
}
.content .two-column > div.bigger {
  flex: 1.2 0 0;
}
@media (min-width: 768px) and (max-width: 1440px) {
  .content .two-column {
    max-width: calc(100vw - 384px);
  }
}
.content .two-column .circle {
  border-radius: 1000px;
  border: 1px solid #393939;
  box-shadow: 15px 15px 30px 0 rgba(0, 0, 0, 0.25);
}
@media (max-width: 768px) {
  .content .two-column .circle {
    width: 50%;
    margin: 0 25%;
  }
}
.content p {
  margin-bottom: 24px;
}
.content p:last-of-type {
  margin-bottom: 0;
}
.content .centered {
  text-align: center;
}
@media (max-width: 768px) {
  .content h3 {
    text-align: center;
  }
}
.content .showcase {
  max-width: calc(100vw - 384px);
}
.content .showcase .centered {
  margin-bottom: 48px;
}
@media (max-width: 768px) {
  .content .showcase .centered {
    margin-bottom: 24px;
  }
  .content .showcase .centered h3 {
    text-align: center;
  }
  .content .showcase .centered p {
    text-align: justify;
  }
}
@media only screen and (min-device-width: 1024px) and (max-device-width: 1366px) and (orientation: portrait) {
  .content .showcase {
    max-width: none;
  }
}
@media (max-width: 768px) {
  .content .showcase {
    max-width: calc(100vw - 48px);
  }
}
.content .showcase .showcase-items {
  box-shadow: 15px 15px 30px 0 rgba(0, 0, 0, 0.25);
  border: 1px solid #393939;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
}
@media (max-width: 768px) {
  .content .showcase .showcase-items {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  .content .showcase .showcase-items p, .content .showcase .showcase-items h4 {
    font-size: 14.4px;
  }
}
@media (max-width: 768px) and (min-width: 768px) and (max-width: 1440px) {
  .content .showcase .showcase-items p, .content .showcase .showcase-items h4 {
    font-size: 14.4px;
  }
}
@media (max-width: 768px) and (min-width: 1441px) {
  .content .showcase .showcase-items p, .content .showcase .showcase-items h4 {
    font-size: 19.2px;
  }
}
.content .showcase .showcase-items > div {
  background: #FFFFFF;
  padding: 24px 24px 0 24px;
  border-right: 1px solid #393939;
  overflow: hidden;
}
.content .showcase .showcase-items > div:last-of-type {
  border-right: none;
}
@media (max-width: 768px) {
  .content .showcase .showcase-items > div {
    border-right: none;
    border-bottom: 1px solid #393939;
  }
}
.content .showcase .showcase-items > div.prototype img {
  position: relative;
  width: 366px;
  left: -64px;
  top: 25px;
  transform: rotate(-2deg);
  border-top: 1px solid #393939;
}
.content .showcase .showcase-items > div.screenplay img {
  position: relative;
  width: 320px;
  left: -42px;
  top: 25px;
  transform: rotate(1deg);
  border-top: 1px solid #393939;
}
.content .showcase .showcase-items > div.game-design-document img {
  position: relative;
  width: 300px;
  left: -42px;
  top: 25px;
  transform: rotate(-2deg);
  border-top: 1px solid #393939;
}
.content .showcase .showcase-items > div.concept-art {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: 55% 147px;
  background-image: url("/images/about/concept2.png");
}
@media (max-width: 768px) {
  .content .showcase .showcase-items > div.concept-art {
    height: 50vh;
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: center 10vh;
    border-bottom: 0;
  }
  .content .showcase .showcase-items > div.concept-art p {
    background: linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, rgb(255, 255, 255) 40%, rgb(255, 255, 255) 100%);
  }
}
@media (min-width: 1441px) {
  .content .showcase .showcase-items > div.prototype img, .content .showcase .showcase-items > div.screenplay img, .content .showcase .showcase-items > div.game-design-document img {
    width: 120%;
    position: relative;
    left: -10%;
  }
}
@media (max-width: 768px) {
  .content .showcase .showcase-items > div.prototype img, .content .showcase .showcase-items > div.screenplay img, .content .showcase .showcase-items > div.game-design-document img {
    width: 120%;
    position: relative;
    left: -10%;
  }
}
@media (min-width: 1441px) {
  .content .showcase .showcase-items > div.prototype img {
    width: 130%;
    left: -15%;
    top: 48px;
  }
}
@media (max-width: 768px) {
  .content .email {
    display: flex;
    justify-content: center;
    margin-top: 24px;
    margin-bottom: 24px;
  }
}
.content img.signature {
  width: 192px;
  height: auto;
  display: block;
  margin-top: -12px;
  margin-left: 12px;
}
.content img.screenshot {
  border: 1px solid #393939;
  border-radius: 6px;
  box-shadow: 15px 15px 30px 0 rgba(0, 0, 0, 0.25);
  transform: rotate(-1deg);
}
.content img {
  width: 100%;
  transition: transform 0.3s ease;
}
.content img:not(.signature):hover {
  transform: rotate(0deg) scale(1.05);
}

.page-listen .subscribe, footer .subscribe {
  max-width: min(100vw - 384px, 576px);
}
@media (max-width: 768px) {
  .page-listen .subscribe, footer .subscribe {
    max-width: none;
  }
}
.page-listen h2, footer h2 {
  text-align: center;
  margin-bottom: 48px;
  display: block;
  font-weight: normal;
}
@media (max-width: 768px) {
  .page-listen h2, footer h2 {
    font-size: 18px;
  }
}
@media (min-width: 768px) and (max-width: 1440px) {
  .page-listen h2, footer h2 {
    font-size: 18px;
  }
}
@media (min-width: 1441px) {
  .page-listen h2, footer h2 {
    font-size: 24px;
  }
}
@media (max-width: 768px) {
  .page-listen h2, footer h2 {
    margin-bottom: 24px;
  }
}
.page-listen .subscribe-links, footer .subscribe-links {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  justify-content: center;
}
.page-listen .subscribe-links a, footer .subscribe-links a {
  border: 1px solid #393939;
  display: flex;
  align-items: center;
  padding: 12px 24px;
  text-decoration: none;
  color: #393939;
  transition: all 0.3s ease;
  border-radius: 10px;
  background: rgba(57, 57, 57, 0.05);
  height: 62px;
  filter: saturate(70%);
}
.page-listen .subscribe-links a:hover, footer .subscribe-links a:hover {
  background: rgba(57, 57, 57, 0.1);
}
.page-listen .subscribe-links a img, .page-listen .subscribe-links a svg, footer .subscribe-links a img, footer .subscribe-links a svg {
  height: 24px;
  width: auto;
  margin-right: 16px;
  transition: all 0.3s ease;
  overflow: visible;
}
.page-listen .subscribe-links a img:hover, .page-listen .subscribe-links a svg:hover, footer .subscribe-links a img:hover, footer .subscribe-links a svg:hover {
  transform: scale(1);
}
.page-listen .subscribe-links a span, footer .subscribe-links a span {
  transition: all 0.3s ease;
}
@media (max-width: 768px) {
  .page-listen .subscribe-links a span, footer .subscribe-links a span {
    font-size: 13.5px;
  }
}
@media (min-width: 768px) and (max-width: 1440px) {
  .page-listen .subscribe-links a span, footer .subscribe-links a span {
    font-size: 13.5px;
  }
}
@media (min-width: 1441px) {
  .page-listen .subscribe-links a span, footer .subscribe-links a span {
    font-size: 18px;
  }
}
.page-listen .subscribe-links a.apple, footer .subscribe-links a.apple {
  background: #393939;
  color: #FFF6F7;
  padding-left: 12px;
}
.page-listen .subscribe-links a.apple img, footer .subscribe-links a.apple img {
  height: 36px;
}
.page-listen .subscribe-links a.apple:hover, footer .subscribe-links a.apple:hover {
  background: #a945e3;
  color: #FFF6F7;
}
.page-listen .subscribe-links a.spotify, footer .subscribe-links a.spotify {
  background: #1ed760;
  border: 0;
}
.page-listen .subscribe-links a.spotify svg path, footer .subscribe-links a.spotify svg path {
  fill: #FFF6F7;
}
.page-listen .subscribe-links a.spotify:hover, footer .subscribe-links a.spotify:hover {
  background: #393939;
}
.page-listen .subscribe-links a.spotify:hover svg path, footer .subscribe-links a.spotify:hover svg path {
  fill: #1ed760;
}
.page-listen .subscribe-links a.youtube:hover, footer .subscribe-links a.youtube:hover {
  background: #ff0000;
  color: #FFF6F7;
}
.page-listen .subscribe-links a.youtube:hover svg g.style-scope.yt-icon path[fill=red], footer .subscribe-links a.youtube:hover svg g.style-scope.yt-icon path[fill=red] {
  fill: #FFF6F7;
}
.page-listen .subscribe-links a.youtube:hover svg g.style-scope.yt-icon path[fill="#fff"], footer .subscribe-links a.youtube:hover svg g.style-scope.yt-icon path[fill="#fff"] {
  fill: #ff0000;
}
.page-listen .subscribe-links a.youtube:hover svg g.style-scope.yt-icon path[style*="fill:#282828"], footer .subscribe-links a.youtube:hover svg g.style-scope.yt-icon path[style*="fill:#282828"] {
  fill: #FFF6F7 !important;
}
.page-listen .subscribe-links a.amazon, footer .subscribe-links a.amazon {
  background: #34D1D9;
  border: 0;
}
.page-listen .subscribe-links a.amazon svg, footer .subscribe-links a.amazon svg {
  height: 24px;
  width: auto;
  max-height: 24px;
  max-width: 120px;
  display: block;
}
.page-listen .subscribe-links a.amazon svg path.amazon-logo, footer .subscribe-links a.amazon svg path.amazon-logo {
  fill: #393939;
}
.page-listen .subscribe-links a.amazon:hover, footer .subscribe-links a.amazon:hover {
  background: #393939;
}
.page-listen .subscribe-links a.amazon:hover svg path.amazon-logo, footer .subscribe-links a.amazon:hover svg path.amazon-logo {
  fill: #34D1D9;
}
.page-listen .subscribe-links a.rss, footer .subscribe-links a.rss {
  background: #f78422;
  border: 0;
  padding-left: 12px;
}
.page-listen .subscribe-links a.rss svg path, footer .subscribe-links a.rss svg path {
  fill: #FFF6F7;
}
.page-listen .subscribe-links a.rss span, footer .subscribe-links a.rss span {
  color: #FFF6F7;
}
.page-listen .subscribe-links a.rss:hover, footer .subscribe-links a.rss:hover {
  background: #393939;
}
.page-listen .subscribe-links a.rss:hover svg path, footer .subscribe-links a.rss:hover svg path {
  fill: #f78422;
}
.page-listen .subscribe-links a.spotify img, .page-listen .subscribe-links a.spotify svg, .page-listen .subscribe-links a.youtube img, .page-listen .subscribe-links a.youtube svg, .page-listen .subscribe-links a.amazon img, .page-listen .subscribe-links a.amazon svg, .page-listen .subscribe-links a.iheart-radio img, .page-listen .subscribe-links a.iheart-radio svg, footer .subscribe-links a.spotify img, footer .subscribe-links a.spotify svg, footer .subscribe-links a.youtube img, footer .subscribe-links a.youtube svg, footer .subscribe-links a.amazon img, footer .subscribe-links a.amazon svg, footer .subscribe-links a.iheart-radio img, footer .subscribe-links a.iheart-radio svg {
  margin: 0;
}
.page-listen .subscribe-links a.spotify span, .page-listen .subscribe-links a.youtube span, .page-listen .subscribe-links a.amazon span, .page-listen .subscribe-links a.iheart-radio span, footer .subscribe-links a.spotify span, footer .subscribe-links a.youtube span, footer .subscribe-links a.amazon span, footer .subscribe-links a.iheart-radio span {
  display: none;
}
@media (max-width: 768px) {
  .page-listen .subscribe-links, footer .subscribe-links {
    gap: 12px;
  }
  .page-listen .subscribe-links a, footer .subscribe-links a {
    height: 52px;
    padding: 12px 24px;
  }
}
.page-listen .content, footer .content {
  max-width: calc(100vw - 384px);
}
@media (max-width: 768px) {
  .page-listen .content, footer .content {
    max-width: calc(100vw - 24px);
  }
}
.page-listen .chapters, footer .chapters {
  max-width: min(100vw - 384px, 1344px);
}
@media (max-width: 768px) {
  .page-listen .chapters, footer .chapters {
    max-width: calc(100vw - 24px);
  }
}
.page-listen .chapters h2, footer .chapters h2 {
  display: none;
}
.page-listen .location-cards, .page-listen .character-lore-cards, footer .location-cards, footer .character-lore-cards {
  display: grid;
  /* Use exact 25% width for each column to ensure equal sizing */
  grid-template-columns: 25% 25% 25% 25%;
  gap: 0;
  /* Override any problematic inherited styles */
}
.page-listen .location-cards > div, .page-listen .character-lore-cards > div, footer .location-cards > div, footer .character-lore-cards > div {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  box-sizing: border-box;
}
.page-listen .location-cards .character-card, .page-listen .location-cards .world-card, .page-listen .location-cards .lore-card, .page-listen .character-lore-cards .character-card, .page-listen .character-lore-cards .world-card, .page-listen .character-lore-cards .lore-card, footer .location-cards .character-card, footer .location-cards .world-card, footer .location-cards .lore-card, footer .character-lore-cards .character-card, footer .character-lore-cards .world-card, footer .character-lore-cards .lore-card {
  height: max(192px, 40vh);
  border: 0;
  border-bottom: 1px solid #393939;
  border-right: 1px solid #393939;
  background-color: #FFF6F7;
}
.page-listen .location-cards .character-card .character-info, .page-listen .location-cards .character-card .world-info, .page-listen .location-cards .character-card .lore-info, .page-listen .location-cards .world-card .character-info, .page-listen .location-cards .world-card .world-info, .page-listen .location-cards .world-card .lore-info, .page-listen .location-cards .lore-card .character-info, .page-listen .location-cards .lore-card .world-info, .page-listen .location-cards .lore-card .lore-info, .page-listen .character-lore-cards .character-card .character-info, .page-listen .character-lore-cards .character-card .world-info, .page-listen .character-lore-cards .character-card .lore-info, .page-listen .character-lore-cards .world-card .character-info, .page-listen .character-lore-cards .world-card .world-info, .page-listen .character-lore-cards .world-card .lore-info, .page-listen .character-lore-cards .lore-card .character-info, .page-listen .character-lore-cards .lore-card .world-info, .page-listen .character-lore-cards .lore-card .lore-info, footer .location-cards .character-card .character-info, footer .location-cards .character-card .world-info, footer .location-cards .character-card .lore-info, footer .location-cards .world-card .character-info, footer .location-cards .world-card .world-info, footer .location-cards .world-card .lore-info, footer .location-cards .lore-card .character-info, footer .location-cards .lore-card .world-info, footer .location-cards .lore-card .lore-info, footer .character-lore-cards .character-card .character-info, footer .character-lore-cards .character-card .world-info, footer .character-lore-cards .character-card .lore-info, footer .character-lore-cards .world-card .character-info, footer .character-lore-cards .world-card .world-info, footer .character-lore-cards .world-card .lore-info, footer .character-lore-cards .lore-card .character-info, footer .character-lore-cards .lore-card .world-info, footer .character-lore-cards .lore-card .lore-info {
  height: 100%;
}
@media (min-width: 768px) and (max-width: 1440px) {
  .page-listen .location-cards .character-card, .page-listen .location-cards .world-card, .page-listen .location-cards .lore-card, .page-listen .character-lore-cards .character-card, .page-listen .character-lore-cards .world-card, .page-listen .character-lore-cards .lore-card, footer .location-cards .character-card, footer .location-cards .world-card, footer .location-cards .lore-card, footer .character-lore-cards .character-card, footer .character-lore-cards .world-card, footer .character-lore-cards .lore-card {
    height: max(192px, 35vh);
  }
}
@media (max-width: 768px) {
  .page-listen .location-cards .character-card, .page-listen .location-cards .world-card, .page-listen .location-cards .lore-card, .page-listen .character-lore-cards .character-card, .page-listen .character-lore-cards .world-card, .page-listen .character-lore-cards .lore-card, footer .location-cards .character-card, footer .location-cards .world-card, footer .location-cards .lore-card, footer .character-lore-cards .character-card, footer .character-lore-cards .world-card, footer .character-lore-cards .lore-card {
    display: flex;
    flex-direction: column;
    height: auto;
  }
  .page-listen .location-cards .character-card .character-info, .page-listen .location-cards .character-card .world-info, .page-listen .location-cards .character-card .lore-info, .page-listen .location-cards .world-card .character-info, .page-listen .location-cards .world-card .world-info, .page-listen .location-cards .world-card .lore-info, .page-listen .location-cards .lore-card .character-info, .page-listen .location-cards .lore-card .world-info, .page-listen .location-cards .lore-card .lore-info, .page-listen .character-lore-cards .character-card .character-info, .page-listen .character-lore-cards .character-card .world-info, .page-listen .character-lore-cards .character-card .lore-info, .page-listen .character-lore-cards .world-card .character-info, .page-listen .character-lore-cards .world-card .world-info, .page-listen .character-lore-cards .world-card .lore-info, .page-listen .character-lore-cards .lore-card .character-info, .page-listen .character-lore-cards .lore-card .world-info, .page-listen .character-lore-cards .lore-card .lore-info, footer .location-cards .character-card .character-info, footer .location-cards .character-card .world-info, footer .location-cards .character-card .lore-info, footer .location-cards .world-card .character-info, footer .location-cards .world-card .world-info, footer .location-cards .world-card .lore-info, footer .location-cards .lore-card .character-info, footer .location-cards .lore-card .world-info, footer .location-cards .lore-card .lore-info, footer .character-lore-cards .character-card .character-info, footer .character-lore-cards .character-card .world-info, footer .character-lore-cards .character-card .lore-info, footer .character-lore-cards .world-card .character-info, footer .character-lore-cards .world-card .world-info, footer .character-lore-cards .world-card .lore-info, footer .character-lore-cards .lore-card .character-info, footer .character-lore-cards .lore-card .world-info, footer .character-lore-cards .lore-card .lore-info {
    position: static;
    opacity: 1;
    height: auto;
    flex: 1;
    display: flex;
    flex-direction: column;
  }
}
.page-listen .location-cards .world-card, footer .location-cards .world-card {
  grid-column: span 4;
  border-right: 0;
}
.page-listen .location-cards .world-card:first-of-type, footer .location-cards .world-card:first-of-type {
  border-top: 1px solid #393939;
}
@media (max-width: 768px) {
  .page-listen .location-cards, footer .location-cards {
    grid-template-columns: 1fr;
  }
  .page-listen .location-cards .world-card, footer .location-cards .world-card {
    grid-column: span 1;
  }
}
.page-listen .character-lore-cards, footer .character-lore-cards {
  /* Fix for last column in each row */
  /* Remove bottom border from last row */
}
.page-listen .character-lore-cards > *:nth-child(4n), footer .character-lore-cards > *:nth-child(4n) {
  border-right: 0;
}
.page-listen .character-lore-cards > *:nth-last-child(-n+4):nth-child(4n+1), .page-listen .character-lore-cards > *:nth-last-child(-n+3):nth-child(4n+2), .page-listen .character-lore-cards > *:nth-last-child(-n+2):nth-child(4n+3), .page-listen .character-lore-cards > *:nth-last-child(-n+1):nth-child(4n+4), .page-listen .character-lore-cards > *:nth-last-child(-n+4):nth-child(4n+1), .page-listen .character-lore-cards > *:nth-last-child(-n+3):nth-child(4n+2), .page-listen .character-lore-cards > *:nth-last-child(-n+2):nth-child(4n+3), .page-listen .character-lore-cards > *:nth-last-child(-n+1):nth-child(4n+4), footer .character-lore-cards > *:nth-last-child(-n+4):nth-child(4n+1), footer .character-lore-cards > *:nth-last-child(-n+3):nth-child(4n+2), footer .character-lore-cards > *:nth-last-child(-n+2):nth-child(4n+3), footer .character-lore-cards > *:nth-last-child(-n+1):nth-child(4n+4), footer .character-lore-cards > *:nth-last-child(-n+4):nth-child(4n+1), footer .character-lore-cards > *:nth-last-child(-n+3):nth-child(4n+2), footer .character-lore-cards > *:nth-last-child(-n+2):nth-child(4n+3), footer .character-lore-cards > *:nth-last-child(-n+1):nth-child(4n+4) {
  border-bottom: 0;
}
@media (max-width: 768px) {
  .page-listen .character-lore-cards, footer .character-lore-cards {
    /* Use exact 50% width for each column in mobile */
    grid-template-columns: 50% 50%;
    /* For mobile, reset borders */
    /* Add right border to even columns in mobile */
    /* Add bottom border to all rows except the last one in mobile */
    /* Remove bottom border from last row in mobile (last 2 items) */
  }
  .page-listen .character-lore-cards > *, footer .character-lore-cards > * {
    border-bottom: none !important;
    width: 100% !important;
  }
  .page-listen .character-lore-cards > *:nth-child(2n), footer .character-lore-cards > *:nth-child(2n) {
    border-right: 0;
  }
  .page-listen .character-lore-cards > *:nth-last-child(n+3), footer .character-lore-cards > *:nth-last-child(n+3) {
    border-bottom: 1px solid #393939 !important;
  }
  .page-listen .character-lore-cards > *:nth-last-child(-n+2), footer .character-lore-cards > *:nth-last-child(-n+2) {
    border-bottom: 0 !important;
  }
}
.page-listen .chapter, footer .chapter {
  margin-bottom: 96px;
  border-radius: 10px;
  border: 1px solid #393939;
  overflow: hidden;
  padding: 0;
}
@media (max-width: 768px) {
  .page-listen .chapter, footer .chapter {
    margin-bottom: 48px;
  }
}
.page-listen .chapter a.audio-player, .page-listen .chapter div.audio-player, footer .chapter a.audio-player, footer .chapter div.audio-player {
  display: flex;
  align-items: center;
  gap: 48px;
  text-decoration: none;
  color: #393939;
  transition: all 0.3s ease;
  border-radius: 10px;
}
.page-listen .chapter a.audio-player:hover, .page-listen .chapter div.audio-player:hover, footer .chapter a.audio-player:hover, footer .chapter div.audio-player:hover {
  background-color: rgba(57, 57, 57, 0.1);
}
.page-listen .chapter a.audio-player:hover .chapter-image .play-button, .page-listen .chapter div.audio-player:hover .chapter-image .play-button, footer .chapter a.audio-player:hover .chapter-image .play-button, footer .chapter div.audio-player:hover .chapter-image .play-button {
  opacity: 0.5;
  transform: translate(-50%, -50%) scale(1.2);
}
.page-listen .chapter a.audio-player img, .page-listen .chapter div.audio-player img, footer .chapter a.audio-player img, footer .chapter div.audio-player img {
  width: 288px;
  height: auto;
  flex-shrink: 0;
  position: relative;
}
.page-listen .chapter a.audio-player img:hover, .page-listen .chapter div.audio-player img:hover, footer .chapter a.audio-player img:hover, footer .chapter div.audio-player img:hover {
  transform: scale(1);
}
.page-listen .chapter a.audio-player .chapter-image, .page-listen .chapter div.audio-player .chapter-image, footer .chapter a.audio-player .chapter-image, footer .chapter div.audio-player .chapter-image {
  position: relative;
  display: inline-block;
  line-height: 0;
}
.page-listen .chapter a.audio-player .chapter-image .play-button, .page-listen .chapter div.audio-player .chapter-image .play-button, footer .chapter a.audio-player .chapter-image .play-button, footer .chapter div.audio-player .chapter-image .play-button {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 96px;
  height: 96px;
  z-index: 1;
  opacity: 0.8;
  transition: all 0.3s ease;
  opacity: 0;
}
.page-listen .chapter a.audio-player .chapter-info, .page-listen .chapter div.audio-player .chapter-info, footer .chapter a.audio-player .chapter-info, footer .chapter div.audio-player .chapter-info {
  flex: 1;
  padding: 24px 24px 24px 0;
}
.page-listen .chapter a.audio-player .chapter-info h3, .page-listen .chapter div.audio-player .chapter-info h3, footer .chapter a.audio-player .chapter-info h3, footer .chapter div.audio-player .chapter-info h3 {
  margin-bottom: 24px;
}
@media (max-width: 768px) {
  .page-listen .chapter a.audio-player, .page-listen .chapter div.audio-player, footer .chapter a.audio-player, footer .chapter div.audio-player {
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 24px;
  }
  .page-listen .chapter a.audio-player .chapter-image, .page-listen .chapter div.audio-player .chapter-image, footer .chapter a.audio-player .chapter-image, footer .chapter div.audio-player .chapter-image {
    width: 100%;
  }
  .page-listen .chapter a.audio-player .chapter-image img, .page-listen .chapter div.audio-player .chapter-image img, footer .chapter a.audio-player .chapter-image img, footer .chapter div.audio-player .chapter-image img {
    width: 100%;
    margin: 0;
  }
  .page-listen .chapter a.audio-player .chapter-image .play-button, .page-listen .chapter div.audio-player .chapter-image .play-button, footer .chapter a.audio-player .chapter-image .play-button, footer .chapter div.audio-player .chapter-image .play-button {
    opacity: 0.6;
  }
  .page-listen .chapter a.audio-player .chapter-info, .page-listen .chapter div.audio-player .chapter-info, footer .chapter a.audio-player .chapter-info, footer .chapter div.audio-player .chapter-info {
    width: 100%;
    padding: 0 24px 24px 24px;
  }
  .page-listen .chapter a.audio-player .chapter-info p, .page-listen .chapter div.audio-player .chapter-info p, footer .chapter a.audio-player .chapter-info p, footer .chapter div.audio-player .chapter-info p {
    text-align: left;
  }
}
.page-listen .chapter .chapter-extra, footer .chapter .chapter-extra {
  display: none;
  overflow: hidden;
  transition: all 0.5s ease;
}
.page-listen .chapter .chapter-extra.chapter-characters h5, footer .chapter .chapter-extra.chapter-characters h5 {
  width: 100%;
  display: block;
  text-align: center;
}
.page-listen .chapter .chapter-extra.chapter-characters h6, .page-listen .chapter .chapter-extra.chapter-characters p, footer .chapter .chapter-extra.chapter-characters h6, footer .chapter .chapter-extra.chapter-characters p {
  display: none;
}
.page-listen .chapter.active, footer .chapter.active {
  background-color: rgba(57, 57, 57, 0.1);
}
.page-listen .chapter.active .audio-player img, footer .chapter.active .audio-player img {
  display: none;
}
.page-listen .chapter.active .audio-player iframe, footer .chapter.active .audio-player iframe {
  flex-shrink: 0;
  display: block;
  max-width: 288px;
}
@media (max-width: 768px) {
  .page-listen .chapter.active .audio-player iframe, footer .chapter.active .audio-player iframe {
    width: 100% !important;
    max-width: 100%;
  }
}
@media (max-width: 768px) {
  .page-listen .chapter.active, footer .chapter.active {
    padding: 0;
  }
}
.page-listen .chapter.active .chapter-extra, footer .chapter.active .chapter-extra {
  display: block;
}

.page-contact .content {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  max-width: min(100vw - 384px, 960px);
  margin: 0 auto;
  padding: 0;
}
@media (min-width: 768px) and (max-width: 1440px) {
  .page-contact .content {
    grid-template-columns: 1fr;
    gap: 24px;
    justify-items: center;
  }
  .page-contact .content .email, .page-contact .content .phone {
    grid-column: 1/-1;
    max-width: none;
  }
}
@media (max-width: 768px) {
  .page-contact .content {
    grid-template-columns: 1fr;
    gap: 24px;
    max-width: none;
  }
}
.page-contact .content .skull-shadow {
  grid-column: 1/-1;
  width: 100%;
  max-width: 384px;
  margin: 0 auto;
  display: block;
  margin-bottom: 48px;
  margin-top: 48px;
}
@media (max-width: 768px) {
  .page-contact .content .skull-shadow {
    max-width: 192px;
    margin-top: 96px;
    margin-bottom: 0;
  }
}
.page-contact .content p {
  grid-column: 1/-1;
  text-align: center;
  margin-bottom: 48px;
}
@media (max-width: 768px) {
  .page-contact .content p {
    margin-bottom: 0;
  }
}
.page-contact .content .email, .page-contact .content .phone {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0;
  min-width: 0;
}
.page-contact .content .email a, .page-contact .content .phone a {
  margin: 0;
}
.page-contact .content .contact-image {
  grid-column: 1/-1;
  width: 100%;
  max-width: 768px;
  height: auto;
  margin: 0 auto 24px;
  display: block;
}
.page-contact .content .contact-image:hover {
  transform: scale(1);
}
@media (min-width: 768px) and (max-width: 1440px) {
  .page-contact .content .contact-image {
    margin-bottom: 0;
  }
}
@media (max-width: 768px) {
  .page-contact .content .contact-image {
    width: 90%;
    margin-bottom: 0;
  }
}

.link, nav a {
  text-decoration: none;
  transition: all 0.3s ease;
  padding: 2px 6px 2px;
  background: transparent;
  margin: 0 -5px;
}
.link:hover, .link.current, nav a:hover, nav a.current {
  background: #393939;
  color: #FFF6F7;
}
.link:hover img, .link.current img, nav a:hover img, nav a.current img {
  filter: brightness(0) invert(1);
}
.link.inline-icon img, nav a.inline-icon img {
  width: 14px;
  height: 14px;
  margin-right: 4px;
  margin-bottom: 0px;
}
@media (min-width: 768px) and (max-width: 1440px) {
  .link.inline-icon img, nav a.inline-icon img {
    margin-bottom: -3px;
  }
}
@media (max-width: 768px) {
  .link.inline-icon img, nav a.inline-icon img {
    margin-bottom: -3px;
  }
}

body:not(.is-homepage) {
  padding-top: 277px;
}
body:not(.is-homepage).page-about, body:not(.is-homepage).page-contact, body:not(.is-homepage).page-listen {
  padding-top: 96px;
}
@media (min-width: 768px) and (max-width: 1440px) {
  body:not(.is-homepage) {
    padding-top: 126px;
  }
}
@media (max-width: 768px) {
  body:not(.is-homepage) {
    padding-top: 4px !important;
  }
  body:not(.is-homepage).page-contact {
    padding-top: 96px !important;
  }
  body:not(.is-homepage).page-world {
    padding-top: 12px !important;
  }
}

@media (max-width: 768px) {
  .page-characters .characters-section, .page-characters .worlds-section, .page-world .characters-section, .page-world .worlds-section {
    margin-top: 48px;
  }
}

/*# sourceMappingURL=style.css.map */