/**
 * Homepage only. Rice-paper ground, plum sprigs, and a mount on the pictures.
 * The uploaded paintings are left as they are.
 */

body.home {
	background-color: #f3eee6;
	background-image: url("../images/home-paper-grain.svg");
	background-size: 280px 280px;
}

/* Header, hero, and footer wear a white veil. Clear it so the paper shows through. */
body.home .has-raft-bg-alt-background-color {
	background-color: transparent !important;
}

body.home .wp-site-blocks {
	position: relative;
}

body.home .wp-site-blocks > * {
	position: relative;
	z-index: 1;
	/* Raft makes this a flex column. Without min-width: 0, a phone browser
	   sizes the column to the welcome line and the page scrolls sideways. */
	min-width: 0;
}

body.home .wp-site-blocks::before,
body.home .wp-site-blocks::after {
	content: "";
	position: absolute;
	z-index: 0;
	width: 8.5rem;
	height: 12rem;
	background: url("../images/home-plum-corner.svg") center / contain no-repeat;
	pointer-events: none;
	opacity: 0.8;
}

body.home .wp-site-blocks::before {
	top: 6.5rem;
	left: 0.6rem;
}

/* The theme locks this box to the viewport, so the lower branch sits on the first screen. */
body.home .wp-site-blocks::after {
	right: 0.6rem;
	bottom: 1.5rem;
	transform: scale(-1, -1);
}

/* The logged-in toolbar is 32px. The page box is still a full viewport tall, so lift the branch by that much. */
body.home.admin-bar .wp-site-blocks::after {
	bottom: calc(1.5rem + 32px);
}

body.home .wp-block-heading.has-huge-font-size::before {
	content: "";
	display: block;
	width: 7.5rem;
	height: 2.4rem;
	margin: 0 auto 0.85rem;
	background: url("../images/home-plum-mark.svg") center / contain no-repeat;
}

/* The hero is full-bleed, so the paintings need centering inside it. */
body.home .wp-block-image {
	margin-left: auto;
	margin-right: auto;
}

body.home .wp-block-image img {
	box-sizing: border-box;
	padding: 0.7rem;
	background: #faf6ef;
	border: 1px solid rgba(92, 70, 48, 0.16);
	box-shadow:
		0 1px 0 rgba(255, 255, 255, 0.8) inset,
		0 16px 34px rgba(72, 48, 28, 0.08);
}

/* Let the welcome line wrap. Leave the 900px column width alone. */
body.home .has-fit-text {
	min-width: 0;
	white-space: normal !important;
	overflow-wrap: break-word;
}

/* Flowers sit in the same padding the text already has above it. */
.home-quote-garden .wp-block-quote {
	position: relative;
	margin-bottom: 0 !important;
	border-left-color: #1d1f25;
}

.home-quote-garden .wp-block-quote::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: calc(var(--wp--preset--spacing--80) * -1);
	z-index: 0;
	height: var(--wp--preset--spacing--80);
	background: url("../images/home-quote-garden.svg?v=small") center bottom / 100% auto no-repeat;
	pointer-events: none;
}

.home-quote-garden .wp-block-quote > * {
	position: relative;
	z-index: 1;
}

@media (max-width: 1320px) {
	body.home .wp-site-blocks::before,
	body.home .wp-site-blocks::after {
		display: none;
	}
}