.home-page {
  overflow: clip;
}

.home-page * {
  overflow-wrap: anywhere;
}

.home-hero {
  position: relative;
  isolation: isolate;
  min-height: 44rem;
  padding-block: var(--space-9);
  background-image: linear-gradient(115deg, rgb(11 23 34 / 98%), rgb(11 23 34 / 89%)), repeating-linear-gradient(145deg, transparent 0 76px, rgb(78 155 178 / 9%) 77px 78px, transparent 79px 152px);
}

.home-hero__grid {
  display: grid;
  grid-template-columns: minmax(11.25rem, 2fr) minmax(0, 5fr) minmax(0, 5fr);
  align-items: start;
  gap: var(--space-6);
  min-height: 32rem;
}

.home-hero__manifesto,
.home-hero__rail,
.home-hero__collage,
.home-loop__intro,
.home-loop__annotation,
.home-route-card,
.home-maps__copy,
.home-map-panel,
.home-kraken__narrative,
.home-kraken__panel,
.home-upgrade-module,
.home-profiles__context,
.home-profiles__margin-note,
.home-profile,
.home-progress__copy,
.home-progress__note,
.home-faq__list,
.home-faq__independence,
.home-chapters__intro,
.home-chapters__group {
  min-width: 0;
}

.home-hero__manifesto {
  grid-column: 2;
  width: 100%;
  max-width: 35rem;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-4);
}

.home-hero__manifesto :is(h1, p) {
  margin: 0;
}

.home-hero__manifesto .display {
  font-size: clamp(2.75rem, 5.8vw, 5.5rem);
}

.home-hero__manifesto .lead {
  max-width: 34rem;
}

.home-hero__official {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-3);
  width: 100%;
}

.home-hero__official p {
  max-width: 25rem;
  color: var(--color-aged-paper);
  font-size: 0.9rem;
}

.home-hero__rail {
  grid-column: 1;
  grid-row: 1;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: var(--space-4);
  width: 100%;
  border-inline-start: 1px solid rgb(231 215 180 / 45%);
  padding-inline-start: var(--space-4);
}

.home-hero__rail :is(p, ul, ol) {
  margin: 0;
}

.home-hero__rail-label {
  color: var(--color-aged-paper);
  font-family: var(--font-heading);
  font-size: 1.25rem;
}

.home-hero__tags,
.home-hero__index {
  display: grid;
  gap: var(--space-2);
  width: 100%;
}

.home-hero__tags li {
  width: 100%;
  color: var(--color-aged-paper);
  font-size: var(--text-meta);
  font-weight: 600;
  letter-spacing: 0.08em;
  line-height: 1.4;
  text-transform: uppercase;
}

.home-hero__index {
  padding: 0;
  list-style: none;
}

.home-hero__index a {
  display: block;
  width: 100%;
  padding-block: var(--space-2);
  color: var(--color-mist-white);
  text-decoration-color: var(--color-cold-sea-blue);
}

.home-hero__rail-note {
  color: var(--color-aged-paper);
  font-size: 0.9rem;
  line-height: 1.55;
}

.home-hero__collage {
  position: relative;
  grid-column: 3;
  grid-row: 1;
  width: 100%;
  min-height: 34rem;
}

.home-hero__media {
  position: absolute;
  overflow: hidden;
  width: 100%;
  margin: 0;
  border: 1px solid var(--color-weathered-timber);
  background: var(--color-abyss-blue);
  box-shadow: var(--shadow-elevated);
}

.home-hero__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.home-hero__media figcaption {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  margin: 0;
  background: rgb(11 23 34 / 84%);
  color: var(--color-aged-paper);
  padding: var(--space-2) var(--space-3);
  font-size: var(--text-meta);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.home-hero__media--longship {
  z-index: 1;
  inset: 2rem auto auto 0;
  width: 67%;
  height: 28rem;
  transform: rotate(-3deg);
}

.home-hero__media--longship img { object-position: 52% 34%; }

.home-hero__media--creature {
  z-index: 2;
  top: 0;
  right: 0;
  width: 47%;
  height: 17rem;
  transform: rotate(4deg);
}

.home-hero__media--creature img { object-position: 48% 31%; }

.home-hero__media--gear {
  z-index: 3;
  right: 5%;
  bottom: 0;
  width: 57%;
  height: 15rem;
  transform: rotate(-2deg);
}

.home-hero__media--gear img { object-position: 50% 54%; }

.home-loop__layout {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--space-5);
}

.home-loop__intro {
  grid-column: 1 / span 5;
  width: 100%;
  max-width: 38.75rem;
}

.home-loop__annotation {
  grid-column: 7 / span 2;
  align-self: end;
  width: 100%;
  border-inline-start: 2px solid var(--color-weathered-timber);
  color: var(--color-text-muted);
  font-family: var(--font-heading);
  font-size: 1.15rem;
  line-height: 1.35;
  padding-inline-start: var(--space-3);
}

.home-loop__cards {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-5);
  width: 100%;
}

.home-route-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-4);
  width: 100%;
  min-height: 20rem;
  border: 1px solid var(--color-border-light);
  padding: var(--space-6);
}

.home-route-card :is(p, h3, a) { margin: 0; }
.home-route-card a { margin-top: auto; font-weight: 600; }
.home-route-card--dark { background: var(--color-midnight-navy); color: var(--color-mist-white); }
.home-route-card--dark .meta { color: var(--color-aged-paper); }
.home-route-card--map { background: var(--color-aged-paper); }
.home-route-card--deep { border-inline-start: 4px solid var(--color-weathered-timber); background: var(--color-abyss-blue); color: var(--color-mist-white); }
.home-route-card--deep .meta { color: var(--color-aged-paper); }

.home-route-card:hover {
  border-color: var(--color-cold-sea-blue);
  transform: translateY(-2px);
}

.home-maps__grid {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(18.75rem, 4fr);
  gap: clamp(var(--space-6), 6vw, var(--space-9));
  align-items: start;
}

.home-maps__copy {
  width: 100%;
  max-width: 42.5rem;
}

.home-maps__contrasts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-5);
  width: 100%;
  margin-block: var(--space-6);
}

.home-maps__contrasts > article {
  min-width: 0;
  border-top: 1px solid rgb(243 233 208 / 48%);
  padding-top: var(--space-4);
}

.home-maps__contrasts :is(h3, p) { margin: 0; }
.home-maps__contrasts article { display: flex; flex-direction: column; gap: var(--space-3); }

.home-maps__linkbox {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-3);
  width: min(100%, 26.875rem);
  background: var(--color-dark-iron);
  padding: var(--space-5);
}

.home-maps__linkbox p { margin: 0; }
.home-maps__linkbox a { color: var(--color-aged-paper); font-weight: 600; }

.home-map-panel {
  position: relative;
  width: 100%;
  min-height: 26rem;
  margin-top: var(--space-7);
  overflow: hidden;
  border: 1px solid var(--color-weathered-timber);
  background: var(--color-aged-paper);
  color: var(--color-midnight-navy);
}

.home-map-panel::before,
.home-map-panel::after {
  position: absolute;
  content: "";
  border: 1px solid rgb(118 86 64 / 35%);
}

.home-map-panel::before { inset: 1rem; }
.home-map-panel::after { inset: 2rem; border-style: dashed; }
.home-map-panel__compass { position: absolute; z-index: 2; top: 2.5rem; right: 2rem; color: var(--color-weathered-timber); font-size: 3rem; }
.home-map-panel__title { position: absolute; z-index: 2; top: 2rem; left: 2rem; margin: 0; font-family: var(--font-heading); font-size: 1.35rem; }
.home-map-panel__line { position: absolute; z-index: 1; height: 1px; transform-origin: left center; background: var(--color-cold-sea-blue); }
.home-map-panel__line--one { top: 53%; left: 9%; width: 85%; transform: rotate(-22deg); }
.home-map-panel__line--two { top: 69%; left: 13%; width: 70%; transform: rotate(28deg); }
.home-map-panel__marker { position: absolute; z-index: 2; max-width: 7rem; font-size: var(--text-meta); font-weight: 600; letter-spacing: 0.07em; text-transform: uppercase; }
.home-map-panel__marker--shore { top: 54%; left: 2rem; }
.home-map-panel__marker--deep { right: 1.5rem; bottom: 3rem; }

.home-kraken__grid {
  display: grid;
  grid-template-columns: minmax(0, 6fr) minmax(20rem, 4fr);
  gap: var(--space-7);
  align-items: start;
}

.home-kraken__narrative {
  width: 100%;
  max-width: 38.125rem;
}

.home-danger {
  margin: 0 0 var(--space-3);
  color: var(--color-aged-paper);
  font-size: var(--text-meta);
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.home-danger::before { display: inline-block; width: .6rem; height: .6rem; margin-right: var(--space-2); background: var(--color-ember-red); border-radius: 50%; content: ""; }
.home-kraken__narrative .lead { max-width: 33.125rem; }
.home-kraken__link-copy { max-width: 31rem; }
.home-kraken__link { color: var(--color-aged-paper); font-weight: 600; }

.home-kraken__panel {
  width: 100%;
  margin-bottom: calc(var(--space-6) * -1);
  background: var(--color-storm-grey);
  color: var(--color-midnight-navy);
  padding: var(--space-6);
}

.home-kraken__panel :is(p, h3, ol) { margin: 0; }
.home-kraken__panel ol { display: grid; gap: var(--space-4); margin-top: var(--space-5); padding: 0; list-style: none; }
.home-kraken__panel li { display: flex; flex-direction: column; gap: var(--space-2); width: 100%; border-top: 1px solid rgb(32 42 45 / 38%); padding-top: var(--space-3); }
.home-kraken__panel li strong { font-size: .875rem; letter-spacing: .06em; }

.home-upgrades__intro {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-4);
  width: min(100%, 40rem);
  margin-inline: auto;
  text-align: left;
}

.home-upgrades__intro :is(p, h2, .rule-rune) { width: 100%; margin: 0; }
.home-upgrades__intro .rule-rune { color: var(--color-weathered-timber); }

.home-upgrades__modules {
  display: grid;
  grid-template-columns: minmax(0, 4fr) minmax(0, 4fr) minmax(0, 2fr) minmax(0, 2fr);
  gap: var(--space-4);
  width: 100%;
  margin-top: var(--space-7);
}

.home-upgrade-module {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-3);
  width: 100%;
  min-height: 20rem;
  border-top: 3px double var(--color-weathered-timber);
  background: var(--color-aged-paper);
  padding: var(--space-5);
}

.home-upgrade-module :is(p, h3, a) { margin: 0; }
.home-upgrade-module__number { color: var(--color-weathered-timber); font-family: var(--font-heading); font-size: 2.4rem; line-height: 1; }
.home-upgrade-module a { margin-top: auto; font-weight: 600; }
.home-upgrade-module--gear,
.home-upgrade-module--skins { background: rgb(243 233 208 / 68%); }

.home-profiles__grid {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(4rem, 1fr) minmax(0, 6fr);
  gap: var(--space-5);
  align-items: start;
}

.home-profiles__context { width: 100%; max-width: 31.25rem; }
.home-profiles__margin-note { width: 100%; border-inline-start: 1px solid rgb(231 215 180 / 48%); color: var(--color-aged-paper); font-family: var(--font-heading); font-size: 1.1rem; line-height: 1.5; padding-inline-start: var(--space-3); }
.home-profiles__list { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; width: 100%; }
.home-profile { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-3); width: 100%; border-top: 1px solid rgb(231 215 180 / 48%); padding-block: var(--space-5); }
.home-profile :is(p, h3, a) { margin: 0; }
.home-profile a { color: var(--color-aged-paper); font-weight: 600; }

.home-progress__grid {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(9.375rem, 2fr) minmax(0, 3fr);
  gap: var(--space-5);
  align-items: start;
}

.home-progress__copy { grid-column: 1; width: 100%; max-width: 43.75rem; }
.home-progress__note { grid-column: 2; width: 100%; margin-top: 4rem; border-inline-start: 2px solid var(--color-cold-sea-blue); color: var(--color-text-muted); font-family: var(--font-heading); line-height: 1.4; padding-inline-start: var(--space-3); }
.home-progress__steps { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-5); width: 100%; margin-block: var(--space-6); }
.home-progress__steps article { display: grid; grid-template-columns: minmax(3rem, auto) minmax(0, 1fr); gap: var(--space-4); width: 100%; }
.home-progress__steps :is(p, h3) { margin: 0; }
.home-progress__steps article > div { min-width: 0; display: flex; flex-direction: column; gap: var(--space-2); }
.home-progress__number { color: var(--color-weathered-timber); font-family: var(--font-heading); font-size: 1.7rem; line-height: 1; }
.home-progress__continue { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-3); width: 100%; border-top: 1px solid var(--color-border-light); padding-top: var(--space-5); }
.home-progress__continue p { margin: 0; }
.home-progress__continue a { font-weight: 600; }

.home-faq__grid {
  display: grid;
  grid-template-columns: minmax(0, 8fr) minmax(15rem, 3fr);
  gap: var(--space-7);
  align-items: start;
}

.home-faq__list { width: 100%; max-width: 45rem; }
.home-faq__item { width: 100%; border-top: 1px solid var(--color-border-light); padding-block: var(--space-5); }
.home-faq__item:last-child { border-bottom: 1px solid var(--color-border-light); }
.home-faq__item :is(h3, p) { margin: 0; }
.home-faq__item { display: flex; flex-direction: column; gap: var(--space-3); }
.home-faq__independence { width: 100%; margin-top: 8rem; border: 1px solid var(--color-border-light); background: var(--color-aged-paper); padding: var(--space-5); }
.home-faq__independence :is(p, h3) { margin: 0; }
.home-faq__independence { display: flex; flex-direction: column; gap: var(--space-3); }

.home-chapters__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-6);
  align-items: start;
}

.home-chapters__intro { width: 100%; max-width: 23.75rem; }
.home-chapters__intro .rule-rune { color: var(--color-weathered-timber); }
.home-chapters__group { display: flex; flex-direction: column; align-items: stretch; gap: 0; width: 100%; }
.home-chapters__group > .meta { margin-bottom: var(--space-3); }
.home-chapters__group a { display: grid; grid-template-columns: minmax(2rem, auto) minmax(0, 1fr); column-gap: var(--space-3); row-gap: var(--space-2); width: 100%; border-top: 1px solid rgb(231 215 180 / 44%); padding-block: var(--space-4); color: var(--color-mist-white); text-decoration-color: transparent; }
.home-chapters__group a:last-child { border-bottom: 1px solid rgb(231 215 180 / 44%); }
.home-chapters__group a span { grid-column: 1; grid-row: 1 / span 2; color: var(--color-cold-sea-blue); font-size: var(--text-meta); font-weight: 700; }
.home-chapters__group a strong { grid-column: 2; }
.home-chapters__group a small { grid-column: 2; color: var(--color-aged-paper); line-height: 1.45; }
.home-chapters__group a:hover { text-decoration-color: var(--color-weathered-timber); }

.home-store { padding-block: var(--space-8); }
.home-store__panel { display: flex; flex-direction: column; align-items: center; gap: var(--space-4); width: min(100%, 40rem); margin-inline: auto; background: var(--color-dark-iron); padding: var(--space-7) var(--space-6); }
.home-store__panel :is(p, h2, a) { margin: 0; }
.home-store__panel > p:not(.eyebrow) { width: min(100%, 27.5rem); text-align: left; }
.home-store__panel .button-danger { margin-top: var(--space-2); }

@media (max-width: 67.49rem) {
  .home-hero { min-height: auto; padding-block: var(--space-8); }
  .home-hero__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-5); min-height: auto; }
  .home-hero__manifesto { grid-column: 1; grid-row: 1; }
  .home-hero__collage { grid-column: 2; grid-row: 1; min-height: 27rem; }
  .home-hero__rail { grid-column: 1 / -1; grid-row: 2; display: grid; grid-template-columns: minmax(10rem, 1fr) minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-4); border-top: 1px solid rgb(231 215 180 / 45%); border-inline-start: 0; padding-top: var(--space-4); padding-inline-start: 0; }
  .home-hero__rail-label { grid-column: 1; }
  .home-hero__tags { grid-column: 2; }
  .home-hero__index { grid-column: 3; }
  .home-hero__rail-note { grid-column: 1 / -1; }
  .home-loop__intro { grid-column: 1 / span 7; }
  .home-loop__annotation { grid-column: 9 / span 4; }
  .home-upgrades__modules { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-profiles__grid { grid-template-columns: minmax(0, 1fr); gap: var(--space-6); }
  .home-profiles__margin-note { display: none; }
  .home-profiles__list { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-4); }
  .home-profile { min-height: 18rem; border: 1px solid rgb(231 215 180 / 42%); padding: var(--space-4); }
  .home-profile a { margin-top: auto; }
  .home-progress__grid { grid-template-columns: minmax(0, 1fr); }
  .home-progress__copy { grid-column: 1; }
  .home-progress__note { grid-column: 1; margin-top: 0; max-width: 32rem; }
  .home-faq__grid { grid-template-columns: minmax(0, 1fr); gap: var(--space-6); }
  .home-faq__independence { margin-top: 0; max-width: 32rem; }
  .home-chapters__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-chapters__intro { grid-column: 1 / -1; max-width: 32rem; }
}

@media (max-width: 59.99rem) {
  .home-loop__layout { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-loop__intro { grid-column: 1 / -1; }
  .home-loop__annotation { grid-column: 1 / -1; max-width: 35rem; }
  .home-loop__cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-route-card:nth-child(3) { grid-column: 1 / -1; }
  .home-maps__grid { grid-template-columns: minmax(0, 1fr); gap: var(--space-6); }
  .home-maps__copy { max-width: 42.5rem; }
  .home-map-panel { margin-top: 0; min-height: 20rem; }
  .home-kraken__grid { grid-template-columns: minmax(0, 1fr); gap: var(--space-6); }
  .home-kraken__panel { margin-bottom: 0; }
  .home-kraken__panel ol { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .home-kraken__panel li { min-width: 0; }
}

@media (max-width: 43.74rem) {
  .home-hero { padding-block: var(--space-7); }
  .home-hero__grid { grid-template-columns: minmax(0, 1fr); gap: var(--space-6); }
  .home-hero__manifesto { grid-column: 1; grid-row: 1; max-width: none; }
  .home-hero__manifesto .display { font-size: clamp(2.75rem, 12vw, 3.7rem); }
  .home-hero__official .button { width: 100%; }
  .home-hero__rail { grid-column: 1; grid-row: 2; grid-template-columns: minmax(0, 1fr); gap: var(--space-3); }
  .home-hero__rail-label,
  .home-hero__tags,
  .home-hero__index,
  .home-hero__rail-note { grid-column: 1; }
  .home-hero__collage { grid-column: 1; grid-row: 3; display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-4); min-height: 0; }
  .home-hero__media { position: relative; inset: auto; width: 100%; height: 17rem; transform: none; }
  .home-hero__media--creature { height: 15rem; }
  .home-hero__media--gear { height: 14rem; }
  .home-loop__layout { grid-template-columns: minmax(0, 1fr); gap: var(--space-5); }
  .home-loop__intro,
  .home-loop__annotation,
  .home-loop__cards { grid-column: 1; }
  .home-loop__cards { grid-template-columns: minmax(0, 1fr); }
  .home-route-card:nth-child(3) { grid-column: 1; }
  .home-route-card { min-height: 0; padding: var(--space-5); }
  .home-maps__contrasts { grid-template-columns: minmax(0, 1fr); }
  .home-map-panel { min-height: 18rem; }
  .home-map-panel::after { display: none; }
  .home-map-panel__line--two { display: none; }
  .home-kraken__panel { padding: var(--space-5); }
  .home-kraken__panel ol { grid-template-columns: minmax(0, 1fr); }
  .home-upgrades__intro { width: 100%; }
  .home-upgrades__modules { grid-template-columns: minmax(0, 1fr); margin-top: var(--space-6); }
  .home-upgrade-module { min-height: 0; }
  .home-profiles__list { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .home-profile { min-height: 0; border-inline: 0; padding-inline: 0; }
  .home-progress__steps article { grid-template-columns: minmax(2.5rem, auto) minmax(0, 1fr); }
  .home-chapters__grid { grid-template-columns: minmax(0, 1fr); }
  .home-chapters__intro { grid-column: 1; }
  .home-store { padding-block: var(--space-7); }
  .home-store__panel { width: 100%; padding: var(--space-6) var(--space-5); }
  .home-store__panel .button-danger { width: 100%; }
}

@media (prefers-reduced-motion: no-preference) {
  .home-route-card { transition: border-color var(--transition-fast), transform var(--transition-fast); }
}

@media (prefers-reduced-motion: reduce) {
  .home-route-card:hover { transform: none; }
}
