/* resources/ts/components/ProductStackTileLabel.module.css */
.ProductStackTileLabel_label {
  background-color: #ffffffee;
  position: relative;
  text-decoration: none;
  text-wrap: pretty;
  &:hover {
    background-image:
      linear-gradient(
        60deg,
        transparent 40%,
        var(--product-color));
    transition: background-color 100ms ease-in-out;
  }
  @media (max-width: 900px) {
    display: flex;
    flex-direction: column;
    padding: var(--spacing-base);
    row-gap: var(--spacing-half);
  }
  @media (min-width: 900px) {
    align-items: center;
    column-gap: var(--spacing-4x);
    display: grid;
    grid-template-areas: "title description" "title release_date";
    grid-template-columns: 400px 400px;
    padding: var(--spacing-2x) var(--spacing-base-plus-half);
    row-gap: var(--spacing-half);
  }
}
.ProductStackTileLabel_label__description,
.ProductStackTileLabel_label__releaseDate {
  font-size: 14px;
}
.ProductStackTileLabel_label__description {
  display: flex;
  flex-wrap: wrap;
  font-style: italic;
  line-height: 1.3;
  @media (min-width: 900px) {
    align-self: flex-end;
    grid-area: description;
  }
}
.ProductStackTileLabel_label__releaseDate {
  line-height: 1.3;
  @media (min-width: 900px) {
    align-self: flex-start;
    grid-area: release_date;
  }
}
.ProductStackTileLabel_label__title {
  font-family: var(--font-family-serif);
  font-weight: 400;
  line-height: 1;
  @media (max-width: 900px) {
    font-size: 60px;
    margin-bottom: var(--spacing-half);
  }
  @media (min-width: 900px) {
    font-size: 80px;
    grid-area: title;
    text-align: right;
  }
}

/* resources/ts/components/HomepageStage.module.css */
@keyframes HomepageStage_fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.HomepageStage_stage {
  animation-duration: 300ms;
  animation-fill-mode: forwards;
  animation-name: HomepageStage_fadeIn;
  animation-timing-function: ease-in-out;
  display: flex;
  opacity: 0;
  overflow: hidden;
  position: relative;
  canvas {
    height: 100%;
    left: 0;
    pointer-events: none;
    position: absolute;
    top: 0;
    user-select: none;
    width: 100%;
  }
}
.HomepageStage_stage__content {
  display: flex;
  position: relative;
  width: 100%;
  @media (max-width: 900px) {
    max-width: 100%;
  }
  @media (min-width: 900px) {
    justify-content: flex-end;
    max-width: clamp(800px, 60%, 60%);
    width: 100%;
  }
}
.HomepageStage_stage__products {
  display: flex;
  flex-direction: column;
  height: 100%;
  justify-content: center;
  row-gap: var(--spacing-2x);
  width: 100%;
  @media (min-width: 900px) {
    align-items: flex-end;
  }
}
/*# sourceMappingURL=/assets/controller-homepage_NR5ZZVNV.css.map */
