/* Natural wall and floor extension fills the photo without cropping the door. */
.ghost-hero--full-view {
  display: grid;
  grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
  align-items: center;
  height: auto;
  min-height: 0;
  margin-top: 92px;
  background: #171817;
}

.ghost-hero--full-view .ghost-hero-photo {
  grid-column: 2;
  grid-row: 1;
  display: block;
  min-width: 0;
  line-height: 0;
}

.ghost-hero--full-view .ghost-hero-photo img {
  display: block;
  width: 100%;
  height: auto;
}

.ghost-hero--full-view .ghost-title {
  position: static;
  grid-column: 1;
  grid-row: 1;
  max-width: none;
  min-width: 0;
  padding: 48px clamp(28px, 4vw, 76px);
}

.ghost-hero--full-view .ghost-title h1 {
  font-size: clamp(38px, 3.5vw, 66px);
  word-break: keep-all;
}

.ghost-hero--full-view .ghost-title > span {
  display: block;
  color: #c7c4bd;
  word-break: keep-all;
}

@media (max-width: 1100px) {
  .ghost-hero--full-view {
    grid-template-columns: minmax(0, 1fr);
  }

  .ghost-hero--full-view .ghost-hero-photo {
    grid-column: 1;
    grid-row: 1;
  }

  .ghost-hero--full-view .ghost-title {
    grid-column: 1;
    grid-row: 2;
    padding: 36px 24px 48px;
  }

  .ghost-hero--full-view .ghost-title h1 {
    font-size: clamp(34px, 6vw, 48px);
  }
}

@media (max-width: 900px) {
  .ghost-hero--full-view {
    margin-top: 72px;
  }
}