/**
 * Root + Ritual — sanctuary CSS.
 * Coolors seed: https://coolors.co/cac0ac-eae8de-c7af94-aac5c4-3d2e1f
 * Live mapping: cream ethos, tan display, sage buttons with white type,
 * white hero type on photography. Fonts also enqueue from functions.php.
 */

:root {
	--rr-white: #ffffff;
	--rr-bone: #f4f1ea;
	--rr-cream: #eae8de;
	--rr-sand: #cac0ac;
	--rr-tan: #c7af94;
	--rr-parchment: #c1a684;
	--rr-bronze: #84704d;
	--rr-umber: #3d2e1f;
	--rr-ink: #2c2622;
	--rr-sage: #aac5c4;
	--rr-sage-deep: #6e8f8e;
	--rr-moss: #3a402c;
}

body,
.editor-styles-wrapper,
.wp-site-blocks {
	background-color: var(--rr-cream) !important;
	color: var(--rr-umber) !important;
	font-family: "Syne", sans-serif !important;
}

body,
p,
.wp-block-paragraph,
.wp-block-list,
.wp-block-navigation,
.wp-block-navigation-item__content,
.wp-block-button__link,
.wp-element-button,
button,
input,
select,
textarea {
	font-family: "Syne", sans-serif !important;
}

h1,
h2,
h3,
h4,
h5,
h6,
.wp-block-heading {
	font-family: "Trocchi", serif !important;
	font-weight: 400 !important;
	color: var(--rr-tan) !important;
}

.wp-block-site-title,
.wp-block-site-title a,
.rr-wordmark,
.rr-wordmark a {
	font-family: "Trocchi", serif !important;
	font-weight: 400 !important;
	color: var(--rr-tan) !important;
	text-decoration: none !important;
	letter-spacing: 0.04em;
}

.wp-block-navigation,
.wp-block-navigation a,
.wp-block-navigation-item__content {
	color: var(--rr-parchment) !important;
	text-decoration: none !important;
	text-transform: lowercase;
	font-size: 13px !important;
	letter-spacing: 0.06em;
}

.wp-block-navigation a:hover,
.wp-block-navigation-item__content:hover {
	color: var(--rr-bronze) !important;
}

a {
	color: var(--rr-umber);
}

a:hover {
	color: var(--rr-bronze);
}

.wp-block-button__link,
.wp-element-button,
.wp-block-search__button,
.rr-btn .wp-block-button__link {
	background-color: var(--rr-sage) !important;
	color: var(--rr-white) !important;
	font-family: "Syne", sans-serif !important;
	font-weight: 400 !important;
	font-size: 14px !important;
	letter-spacing: 0.08em;
	text-transform: lowercase !important;
	border: 0 !important;
	border-radius: 12px !important;
	padding: 0.7rem 1.75rem !important;
}

.wp-block-button__link:hover,
.wp-element-button:hover,
.rr-btn .wp-block-button__link:hover {
	background-color: var(--rr-sage-deep) !important;
	color: var(--rr-white) !important;
}

header.wp-block-template-part,
.rr-site-header {
	padding-top: 1.1rem;
	padding-bottom: 1.1rem;
}

.home header.wp-block-template-part,
.home .rr-site-header {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	width: 100%;
	z-index: 40;
	background: transparent !important;
	padding-top: 1.4rem;
}

.home .rr-wordmark a,
.home .wp-block-site-title a,
.home .wp-block-navigation a,
.home .wp-block-navigation-item__content {
	color: var(--rr-white) !important;
}

.home .wp-block-navigation a:hover,
.home .wp-block-navigation-item__content:hover {
	color: var(--rr-cream) !important;
}

.rr-header-inner {
	row-gap: 0.5rem;
}

.rr-hero.wp-block-cover {
	min-height: 100vh !important;
}

.rr-hero.wp-block-cover .wp-block-cover__inner-container {
	padding-top: 5rem;
	padding-bottom: 3rem;
}

.rr-hero h1,
.rr-hero h2,
.rr-hero h3,
.rr-hero h4,
.rr-hero p,
.rr-hero .wp-block-heading,
.rr-hero .wp-block-paragraph {
	color: var(--rr-white) !important;
	font-family: "Trocchi", serif !important;
}

.rr-hero h1 {
	font-size: clamp(42px, 8vw, 72px) !important;
	letter-spacing: 0.06em;
	margin-bottom: 0.35em !important;
}

.rr-hero h3 {
	font-size: clamp(22px, 4vw, 36px) !important;
	letter-spacing: 0.35em;
	font-weight: 400 !important;
}

.rr-hero h4 {
	font-size: clamp(18px, 3vw, 28px) !important;
}

.rr-hero p {
	font-family: "Syne", sans-serif !important;
	letter-spacing: 0.12em;
	text-transform: none;
	font-size: 14px !important;
}

.rr-ethos {
	padding: 5.5rem 1.25rem 4.5rem !important;
	background-color: var(--rr-cream) !important;
}

.rr-ethos h2,
.rr-ethos h3,
.rr-ethos p,
.rr-ethos .wp-block-heading,
.rr-ethos .wp-block-paragraph {
	font-family: "Trocchi", serif !important;
	color: var(--rr-tan) !important;
	text-align: center;
}

.rr-ethos h2 {
	font-size: clamp(32px, 5vw, 48px) !important;
	margin-bottom: 0.4em !important;
}

.rr-ethos p {
	max-width: 38em;
	margin-left: auto !important;
	margin-right: auto !important;
	line-height: 1.75 !important;
	font-size: 18px !important;
}

.rr-values {
	padding: 4.5rem 1.25rem !important;
	background-color: var(--rr-sand) !important;
}

.rr-values h2,
.rr-values h3 {
	color: var(--rr-tan) !important;
}

.rr-values p {
	color: var(--rr-umber) !important;
	font-size: 15px !important;
	line-height: 1.7;
}

.rr-nap {
	padding: 4rem 1.25rem 5rem !important;
}

.rr-photos {
	padding: 0 !important;
}

.rr-photos .wp-block-image img,
.rr-photos img {
	width: 100%;
	height: auto;
	display: block;
}

.wp-block-gallery {
	gap: 0.5rem;
}

.wp-block-gallery .wp-block-image img {
	border-radius: 0;
}

footer.wp-block-template-part,
.rr-site-footer {
	background-color: var(--rr-cream);
	color: var(--rr-umber);
}

.rr-site-footer a {
	color: var(--rr-umber);
}

.rr-site-footer a:hover {
	color: var(--rr-bronze);
}

body.page-book,
body.page-book .wp-site-blocks,
body.page-book .entry-content,
body.page-book .wp-block-post-content {
	background-color: var(--rr-cream) !important;
	color: var(--rr-umber) !important;
}

body.page-book p,
body.page-book li,
body.page-book h1,
body.page-book h2,
body.page-book label {
	color: var(--rr-umber) !important;
}

body.page-book h1,
body.page-book h2,
body.page-book h3 {
	color: var(--rr-tan) !important;
}

.wp-block-details {
	border-bottom: 1px solid var(--rr-sand);
	padding: 0.75rem 0;
}

.wp-block-details summary {
	font-family: "Trocchi", serif;
	color: var(--rr-tan);
	cursor: pointer;
}

.wp-block-post-title {
	display: none;
}

main.wp-block-group.alignfull > .wp-block-post-content {
	max-width: none;
}

@media (max-width: 781px) {
	.rr-hero h1 {
		font-size: 40px !important;
	}

	.home header.wp-block-template-part {
		position: relative;
		background: var(--rr-cream) !important;
	}

	.home .rr-wordmark a,
	.home .wp-block-navigation a {
		color: var(--rr-tan) !important;
	}
}