/* Sacred Practice Press — styles that theme.json can't express. */

:root {
	--spp-line: var(--wp--preset--color--line);
	--spp-gold: var(--wp--preset--color--gold);
	--spp-ease: cubic-bezier(.2, .7, .2, 1);
}

html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

::selection { background: var(--wp--preset--color--rose); color: var(--wp--preset--color--cream); }

:where(a, button, input, textarea, summary):focus-visible {
	outline: 2px solid var(--wp--preset--color--gold);
	outline-offset: 3px;
}

h1 em, h2 em, h3 em, .has-serif-font-family em { font-weight: 500; }

/* ---------- Eyebrow + moons ---------- */

.is-style-eyebrow {
	font-family: var(--wp--preset--font-family--sans);
	font-size: var(--wp--preset--font-size--x-small) !important;
	font-weight: 500;
	letter-spacing: var(--wp--custom--tracking--eyebrow);
	text-transform: uppercase;
	color: var(--wp--preset--color--gold-deep);
	line-height: 1.5;
}
.is-style-eyebrow.has-text-align-center {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 1.1rem;
}
.is-style-eyebrow.has-text-align-center::before,
.is-style-eyebrow.has-text-align-center::after {
	content: "";
	flex: 0 0 3rem;
	height: 1px;
	background: var(--spp-gold);
	opacity: .7;
}

p.is-style-moons {
	color: var(--spp-gold);
	letter-spacing: .85em;
	font-size: .8rem !important;
	line-height: 1;
	/* letter-spacing adds trailing space; pull it back so centring stays true */
	margin-right: -.85em;
	font-family: "Apple Symbols", "Segoe UI Symbol", "DejaVu Sans", sans-serif;
	user-select: none;
}
p.is-style-moons.has-text-align-center { margin-left: auto; margin-right: auto; padding-left: .85em; }

.is-style-lead {
	font-family: var(--wp--preset--font-family--serif);
	font-size: var(--wp--preset--font-size--x-large) !important;
	font-weight: 500;
	line-height: 1.35;
}
.is-style-lead em { color: var(--wp--preset--color--rose); }

/* ---------- Sections ---------- */

.is-style-section-deep { background-color: var(--wp--preset--color--cream-deep); }

.is-style-section-dark {
	background-color: var(--wp--preset--color--night);
	color: #C9BFB2;
}
.is-style-section-dark :where(h1, h2, h3, h4, h5, h6) { color: var(--wp--preset--color--gold-light); }
.is-style-section-dark a:where(:not(.wp-element-button)) { color: var(--wp--preset--color--gold-light); }
.is-style-section-dark .is-style-eyebrow { color: var(--wp--preset--color--gold-light); }
.is-style-section-dark .is-style-lead em { color: var(--wp--preset--color--gold-light); }
.is-style-section-dark .wp-element-button,
.is-style-section-dark .wp-block-button__link {
	background: var(--wp--preset--color--gold-light);
	color: var(--wp--preset--color--night);
}
.is-style-section-dark .wp-element-button:hover,
.is-style-section-dark .wp-block-button__link:hover { background: #E2C487; color: var(--wp--preset--color--night); }

.is-style-card {
	background: #FBF9F4;
	border: 1px solid var(--spp-line);
	padding: clamp(1.5rem, 3vw, 2.5rem);
}
.is-style-section-deep .is-style-card { background: var(--wp--preset--color--cream); }

/* Thin gold rule, used as a separator style */
.wp-block-separator { border-top-width: 1px; opacity: .8; }
.wp-block-separator:not(.is-style-wide):not(.is-style-dots) { width: 3rem; }

/* ---------- Buttons ---------- */

.wp-element-button, .wp-block-button__link { transition: background-color .25s var(--spp-ease), color .25s var(--spp-ease), border-color .25s var(--spp-ease); }

.wp-block-button.is-style-outline-gold .wp-block-button__link {
	background: transparent;
	color: var(--wp--preset--color--ink);
	border: 1px solid var(--spp-gold);
}
.wp-block-button.is-style-outline-gold .wp-block-button__link:hover {
	background: var(--wp--preset--color--ink);
	border-color: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--cream);
}
.is-style-section-dark .wp-block-button.is-style-outline-gold .wp-block-button__link {
	background: transparent;
	color: var(--wp--preset--color--gold-light);
	border-color: var(--wp--preset--color--gold-light);
}
.is-style-section-dark .wp-block-button.is-style-outline-gold .wp-block-button__link:hover {
	background: var(--wp--preset--color--gold-light);
	color: var(--wp--preset--color--night);
}

.spp-text-link {
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 500;
	letter-spacing: .18em;
	text-transform: uppercase;
}
.spp-text-link a { text-decoration: none; border-bottom: 1px solid currentColor; padding-bottom: 2px; }

/* ---------- Header ---------- */

.spp-header {
	border-bottom: 1px solid var(--spp-line);
	background: var(--wp--preset--color--cream);
}
.spp-header .wp-block-site-logo img { display: block; }
.spp-header .wp-block-navigation a:hover { color: var(--wp--preset--color--rose); }
.spp-header .wp-block-navigation .current-menu-item > a,
.spp-header .wp-block-navigation a[aria-current="page"] { color: var(--wp--preset--color--rose); }

@media (max-width: 599px) {
	.spp-header .wp-block-site-title { font-size: .85rem !important; letter-spacing: .12em !important; }
	.spp-header .wp-block-site-logo img { width: 40px !important; height: auto; }
}

.wp-block-navigation__responsive-container.is-menu-open {
	background: var(--wp--preset--color--cream) !important;
	padding: 2rem 1.5rem;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	gap: 1.4rem;
	font-size: .95rem;
}

/* ---------- Footer ---------- */

.spp-footer { font-size: var(--wp--preset--font-size--small); }
.spp-footer .wp-block-navigation { font-size: var(--wp--preset--font-size--small); text-transform: none; letter-spacing: 0; font-weight: 400; }
.spp-footer .wp-block-navigation a { color: #C9BFB2; }
.spp-footer .wp-block-navigation a:hover { color: var(--wp--preset--color--gold-light); }
.spp-footer .spp-fineprint { color: #A89C8E; font-size: var(--wp--preset--font-size--x-small); }
.spp-footer .spp-fineprint a { color: #C9BFB2; }

/* ---------- Book covers + cards ---------- */

.is-style-cover-shadow img,
.spp-cover img {
	box-shadow:
		0 1px 2px rgba(42, 34, 28, .08),
		0 12px 28px -8px rgba(42, 34, 28, .28),
		0 34px 60px -30px rgba(42, 34, 28, .35);
}
.is-style-section-dark .is-style-cover-shadow img,
.is-style-section-dark .spp-cover img {
	box-shadow: 0 0 0 1px rgba(210, 174, 104, .18), 0 30px 70px -25px rgba(210, 174, 104, .28);
}

.spp-book-card { height: 100%; display: flex; flex-direction: column; }
.spp-book-card .wp-block-post-featured-image,
.spp-book-card .spp-book-placeholder { margin-bottom: 1.25rem; }
.spp-book-card .wp-block-post-featured-image img { aspect-ratio: 1179 / 1522; object-fit: cover; transition: transform .5s var(--spp-ease); }
.spp-book-card:hover .wp-block-post-featured-image img { transform: translateY(-4px); }
.spp-book-card .wp-block-post-title { margin-top: .35rem; }
.spp-book-card .wp-block-post-excerpt { color: var(--wp--preset--color--ink-soft); font-size: var(--wp--preset--font-size--small); }
.spp-book-card .wp-block-post-excerpt__more-text { display: none; }
.spp-book-card .spp-cta { margin-top: auto; padding-top: 1rem; }

/* Covers that don't exist yet: a quiet framed placeholder */
.spp-book-placeholder {
	aspect-ratio: 1179 / 1522;
	background: var(--wp--preset--color--cream-deep);
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	padding: 12%;
	color: var(--wp--preset--color--ink);
	text-decoration: none !important;
	box-shadow: 0 12px 28px -14px rgba(42, 34, 28, .25);
}
.spp-book-placeholder::before {
	content: "";
	position: absolute;
	inset: 6%;
	border: 1px solid var(--spp-gold);
	opacity: .55;
	pointer-events: none;
}
.spp-book-placeholder__moon {
	font-size: 2rem;
	color: var(--spp-gold);
	line-height: 1;
	margin-bottom: 1.1rem;
	font-family: "Apple Symbols", "Segoe UI Symbol", "DejaVu Sans", sans-serif;
}
.spp-book-placeholder__title {
	font-family: var(--wp--preset--font-family--serif);
	font-weight: 600;
	font-size: clamp(1.15rem, 2vw, 1.45rem);
	line-height: 1.15;
}
.spp-book-placeholder__press {
	position: absolute;
	bottom: 11%;
	left: 0; right: 0;
	font-size: .6rem;
	letter-spacing: .24em;
	text-transform: uppercase;
	color: var(--wp--preset--color--gold-deep);
}

/* Status badge (taxonomy terms) */
.taxonomy-spp_book_status a,
.taxonomy-spp_book_status span:not(.wp-block-post-terms__separator) {
	display: inline-block;
	border: 1px solid currentColor;
	padding: .3em .8em .25em;
	border-radius: 999px;
	line-height: 1.3;
}
.taxonomy-spp_book_status .wp-block-post-terms__separator { display: none; }

/* ---------- Lists ---------- */

ul.is-style-moons { list-style: none; padding-left: 0; }
ul.is-style-moons > li { position: relative; padding-left: 2rem; margin-bottom: .9rem; }
ul.is-style-moons > li::before {
	content: "◐";
	position: absolute;
	left: 0;
	top: .05em;
	color: var(--spp-gold);
	font-family: "Apple Symbols", "Segoe UI Symbol", "DejaVu Sans", sans-serif;
}
ul.is-style-moons > li strong { font-weight: 500; color: var(--wp--preset--color--ink); }

/* ---------- Pillars ---------- */

.spp-pillar .spp-numeral {
	font-family: var(--wp--preset--font-family--serif);
	font-style: italic;
	color: var(--wp--preset--color--gold-deep);
	font-size: 1.4rem;
	line-height: 1;
}
.spp-pillar h3 { margin-top: .6rem; }
.spp-pillar .spp-pillar-sub {
	font-family: var(--wp--preset--font-family--serif);
	font-style: italic;
	font-size: 1.15rem;
	color: var(--wp--preset--color--rose);
	margin-top: .15rem;
}

/* ---------- Founder portrait placeholder ---------- */

.spp-portrait {
	aspect-ratio: 4 / 5;
	background:
		radial-gradient(circle at 50% 42%, rgba(184, 149, 90, .22) 0 22%, transparent 22.5%),
		var(--wp--preset--color--cream-deep);
	display: flex;
	align-items: flex-end;
	justify-content: center;
	padding-bottom: 1.5rem;
	border: 1px solid var(--spp-line);
}

/* ---------- Interior page previews ---------- */

.spp-interior-placeholder {
	aspect-ratio: 8.5 / 11;
	background: #FFFDF8;
	border: 1px solid var(--spp-line);
	box-shadow: 0 10px 24px -14px rgba(42, 34, 28, .3);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: .5rem;
	text-align: center;
	padding: 1.5rem;
}
.spp-interior-placeholder p { margin: 0; }

/* ---------- Forms (signup + contact) ---------- */

.spp-form { margin: 0; }
.spp-form .spp-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.spp-form__row { display: flex; gap: .6rem; flex-wrap: wrap; }
.spp-form__row > .spp-input { flex: 1 1 14rem; }
.spp-form label.spp-label {
	display: block;
	font-size: var(--wp--preset--font-size--x-small);
	letter-spacing: .16em;
	text-transform: uppercase;
	font-weight: 500;
	margin-bottom: .4rem;
}
.spp-input, .spp-textarea {
	width: 100%;
	box-sizing: border-box;
	font: inherit;
	font-size: 1rem;
	color: var(--wp--preset--color--ink);
	background: #FFFDF8;
	border: 1px solid var(--spp-line);
	border-radius: 2px;
	padding: .95em 1.1em;
	transition: border-color .2s;
}
.spp-textarea { min-height: 10rem; resize: vertical; }
.spp-input:focus, .spp-textarea:focus { border-color: var(--wp--preset--color--gold); outline: none; box-shadow: 0 0 0 3px rgba(184, 149, 90, .2); }
.spp-form button { cursor: pointer; border: 0; }
.spp-form__note { font-size: var(--wp--preset--font-size--x-small); color: var(--wp--preset--color--ink-soft); margin: .7rem 0 0; }
.spp-form__field { margin-bottom: 1.1rem; }

.spp-form--compact .spp-input { padding: .7em .9em; font-size: .92rem; }
.spp-form--compact button { padding: .8em 1.2em; }

.is-style-section-dark .spp-input {
	background: transparent;
	color: var(--wp--preset--color--cream);
	border-color: rgba(210, 174, 104, .45);
}
.is-style-section-dark .spp-input::placeholder { color: #A89C8E; }
.is-style-section-dark .spp-form__note { color: #A89C8E; }

.spp-notice {
	border-left: 2px solid var(--spp-gold);
	padding: .9rem 1.2rem;
	background: rgba(184, 149, 90, .1);
	margin: 0;
}
.spp-notice p { margin: 0; }
.spp-notice p + p { margin-top: .4rem; }
.spp-notice--error { border-color: var(--wp--preset--color--rose); background: rgba(139, 26, 43, .07); }

/* ---------- FAQ ---------- */

.wp-block-details summary {
	font-family: var(--wp--preset--font-family--serif);
	font-weight: 600;
	font-size: var(--wp--preset--font-size--large);
	cursor: pointer;
	list-style: none;
	display: flex;
	justify-content: space-between;
	gap: 1rem;
}
.wp-block-details summary::-webkit-details-marker { display: none; }
.wp-block-details summary::after { content: "○"; color: var(--spp-gold); font-family: "Apple Symbols", "Segoe UI Symbol", sans-serif; font-size: 1rem; line-height: 2; }
.wp-block-details[open] summary::after { content: "●"; }
.wp-block-details > :not(summary) { margin-top: .8rem; color: var(--wp--preset--color--ink-soft); }

/* ---------- Misc ---------- */

.spp-disclaimer { font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--ink-soft); }
.wp-block-post-content > .alignfull:first-child { margin-top: 0; }
.wp-site-blocks > main { margin-block-start: 0; }
.wp-site-blocks > footer { margin-block-start: 0; }

/* Balanced headings: no one-word last lines */
:where(h1, h2, h3, .is-style-lead) { text-wrap: balance; }
p { text-wrap: pretty; }

.spp-header .wp-block-site-title { white-space: nowrap; }

/* Six menu items don't fit beside the logo on tablets: use the menu button up to 1024px */
@media (min-width: 600px) and (max-width: 1023px) {
	.spp-header .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex; }
	.spp-header .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none; }
}
