.splash {
	display: grid;
	/*grid-template-columns: autor;
	grid-template-rows: auto;*/
	grid-template-areas: "foo";
	/*justify-items: center;*/
	aspect-ratio: 4 / 3;
}
.splash > * {
	grid-area: foo;
	margin: 0;
}
.splash > *:first-child {
  	max-width: 100%;
  	max-height: 100%;
  	/*position: absolute;*/
}
.splash > *:first-child img {
  	object-fit: cover;
  	width: 100%;
  	height: 100%;
}
.splash > *:last-child {
	width: auto;
	max-height: 60%;
}
/*
@media screen and (max-width: 59.938em) and (orientation: portrait) {
  .splash {
  	aspect-ratio: 1 / 2;
  	aspect-ratio: auto;
  	width: 100%;
  	height: calc(100dvh - var(--padding-stage) - var(--offset-navigation));
  }
  .splash > *:last-child {
	max-width: 60%;
	height: auto;
  }
}
@media screen and (max-width: 63.938em) and (orientation: landscape) {
  .splash,
  .splash > *:first-child {
  	aspect-ratio: auto;
  	width: 100%;
  	height: calc(100dvh - var(--padding-stage) - var(--offset-navigation));
  }
}
*/
@media screen and (max-width: 63.938em) {
  .splash,
  .splash > *:first-child {
  	aspect-ratio: auto;
  	width: 100%;
  	/*
	height: calc(100dvh - var(--padding-stage) - var(--offset-navigation));
	*/
	height: calc(100dvh - 25dvh - var(--padding-stage) - var(--offset-navigation));
  }
}
/*
@media screen and (max-width: 63.938em) and (orientation: portrait) {
  .splash,
  .splash > *:first-child {
  	aspect-ratio: auto;
  	width: 100%;
  	height: calc(100dvh - 25dvh - var(--padding-stage) - var(--offset-navigation));
  }
}
*/