/**
 * Rivora v3: homepage patterns (rh-*).
 *
 * Cosmic x Indian maison. Cosmic scenes (hero, alignment) are night skies with layered
 * nebula and grain; the fragrance chapters, almanac and Navagraha band carry the craft:
 * temple arches (mehrab), jali lattice, fine gold-line planet glyphs, gold leaf used
 * sparingly, raw-silk fields in each fragrance's colour.
 *
 * Every decoration is CSS (pseudo-elements, masks of the SVGs in ../ornaments/, tiny
 * tiled textures in ../textures/); the text and images are ordinary blocks.
 * Motion: transform/opacity only, scroll-driven where supported, none for reduced motion.
 */

/* ------------------------------------------------------------------ */
/* Tokens                                                              */
/* ------------------------------------------------------------------ */
:root {
	--rh-night: var(--wp--preset--color--night, #120410);
	--rh-ink: var(--wp--preset--color--plum-ink, #1c0618);
	--rh-plum: var(--wp--preset--color--plum, #641164);
	--rh-cream: var(--wp--preset--color--cream, #f3e9dc);
	--rh-gold: var(--wp--preset--color--gold, #d9b25f);
	--rh-gold-soft: var(--wp--preset--color--gold-soft, #e6c88a);
	--rh-display: var(--wp--preset--font-family--display, "Cormorant Garamond", Georgia, serif);
	--rh-sans: var(--wp--preset--font-family--sans, "Jost", "Segoe UI", system-ui, sans-serif);
	--rh-max: var(--wp--style--global--wide-size, 1320px);
	--rh-pad: max(var(--wp--style--root--padding-left, 1.25rem), calc((100% - var(--rh-max)) / 2));
	--rh-gap: clamp(1rem, 2.2vw, 2rem);
	--rh-block: clamp(5rem, 11vw, 10rem);
	--rh-muted: color-mix(in srgb, var(--rh-cream) 74%, transparent);
	--rh-grain: url(../textures/grain-alpha.webp);
	--rh-leaf: url(../textures/gold-leaf.webp);
	--rh-nebula: url(../textures/nebula.webp);
}

/* ------------------------------------------------------------------ */
/* Shared frame                                                        */
/* ------------------------------------------------------------------ */
.rh-section,
.rh-chapter,
.rh-page-header {
	position: relative;
	isolation: isolate;
	box-sizing: border-box;
	padding-inline: var(--rh-pad);
	color: var(--rh-cream);
	background-color: var(--rh-night);
}

.rivora-main--home > * + * {
	margin-block-start: 0;
}

.rh-hero :where(h1, h2, h3),
.rh-section :where(h1, h2, h3),
.rh-chapter :where(h1, h2, h3),
.rh-page-header :where(h1, h2) {
	font-family: var(--rh-display);
	font-weight: 300;
	line-height: 1;
	letter-spacing: -0.015em;
	text-transform: none;
	color: inherit;
	margin: 0;
	text-wrap: balance;
}

.rh-hero em,
.rh-section em,
.rh-chapter em {
	font-style: italic;
	font-weight: 400;
}

/* ------------------------------------------------------------------ */
/* Links and buttons                                                   */
/* ------------------------------------------------------------------ */
.rh-link a,
a.rh-link,
.rh-link.wp-block-read-more {
	position: relative;
	display: inline-block;
	padding-block: 0.2em;
	font-family: var(--rh-sans);
	font-size: 0.9375rem;
	font-weight: 500;
	color: inherit;
	text-decoration: none;
	background: linear-gradient(currentColor, currentColor) 0 100% / 100% 1px no-repeat;
}
.rh-link a::after,
a.rh-link::after,
.rh-link.wp-block-read-more::after {
	content: "";
	position: absolute;
	inset: auto 0 0 0;
	height: 1px;
	background: var(--rh-gold);
	transform: scaleX(0);
	transform-origin: 100% 50%;
	transition: transform 0.45s cubic-bezier(0.2, 0.7, 0.2, 1);
}
.rh-link a:hover::after,
.rh-link a:focus-visible::after,
a.rh-link:hover::after,
.rh-link.wp-block-read-more:hover::after,
.rh-link.wp-block-read-more:focus-visible::after {
	transform: scaleX(1);
	transform-origin: 0 50%;
}
.rh-link {
	margin: 0;
}

/* Primary action: one flat gold rectangle. */
.rh-btn .wp-block-button__link,
.rh-chapter .rh-chapter__add.wp-block-button > .wp-block-button__link,
.rh-chapter .rh-chapter__add .wc-block-components-product-button__button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 3rem;
	padding: 0.85rem 1.75rem;
	border: 0;
	border-radius: 2px;
	background: var(--rh-gold);
	color: var(--rh-night);
	font-family: var(--rh-sans);
	font-size: 0.9375rem;
	font-weight: 500;
	letter-spacing: 0.01em;
	text-transform: none;
	text-decoration: none;
	box-shadow: none;
	cursor: pointer;
	transition: background-color 0.2s ease;
}
.rh-btn .wp-block-button__link:hover,
.rh-chapter .rh-chapter__add.wp-block-button > .wp-block-button__link:hover,
.rh-chapter .rh-chapter__add .wc-block-components-product-button__button:hover {
	background: var(--rh-cream);
	color: var(--rh-night);
}

.rh-hero :focus-visible,
.rh-section :focus-visible,
.rh-chapter :focus-visible {
	outline: 2px solid var(--rh-gold);
	outline-offset: 3px;
}

.rh-actions {
	gap: 1.25rem 2rem;
	margin-top: 2rem;
}
.rh-actions .wp-block-buttons {
	margin: 0;
}

/* ------------------------------------------------------------------ */
/* 1. Hero: night sky, the bottle as a celestial object               */
/* ------------------------------------------------------------------ */
.wp-block-cover.rh-hero {
	min-height: 100vh !important;
	min-height: 100svh !important;
	padding: calc(var(--rv-header-h, 72px) + 3rem) var(--rh-pad) clamp(2.5rem, 6vh, 4.5rem);
	background-color: var(--rh-night);
	color: var(--rh-cream);
	overflow: hidden;
}

/* Poster (the LCP) and the loop share one box. */
.rh-hero .rh-hero__poster-img,
.rh-hero .rh-hero__video {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
	object-position: 60% 50%;
	z-index: 0;
}
.rh-hero .rh-hero__video {
	opacity: 0;
	transition: opacity 1.6s ease;
}
.rh-hero .rh-hero__video.is-playing {
	opacity: 1;
}

/* Nebula haze around the edges, clear around the bottle. */
.rh-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	background: var(--rh-nebula) 50% 50% / cover no-repeat;
	opacity: 0.6;
	-webkit-mask-image: radial-gradient(ellipse 46% 58% at 64% 46%, transparent 35%, #000 100%);
	mask-image: radial-gradient(ellipse 46% 58% at 64% 46%, transparent 35%, #000 100%);
}
/* Grain and the reading scrim (bottom-left for the headline, top for the header). */
.rh-hero::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	background:
		var(--rh-grain) 0 0 / 256px repeat,
		linear-gradient(to bottom, rgba(18, 4, 16, 0.72) 0, rgba(18, 4, 16, 0) 24%),
		linear-gradient(to top, rgba(18, 4, 16, 0.96) 0, rgba(18, 4, 16, 0.6) 26%, rgba(18, 4, 16, 0) 58%),
		radial-gradient(ellipse 70% 60% at 0% 100%, rgba(18, 4, 16, 0.75), rgba(18, 4, 16, 0) 70%);
}
.rh-hero .wp-block-cover__inner-container {
	position: relative;
	z-index: 2;
	width: 100%;
	max-width: var(--rh-max);
	margin-inline: auto;
	color: inherit;
}

.rh-hero__grid {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	column-gap: var(--rh-gap);
	align-items: end;
}
.rh-hero__grid > * {
	margin: 0;
}
.rh-hero .rh-hero__title {
	grid-column: 1 / span 9;
	font-size: var(--wp--preset--font-size--hero, clamp(3.6rem, 10vw, 10.5rem));
	font-weight: 300;
	line-height: 0.86;
	letter-spacing: -0.03em;
	text-shadow: 0 0.04em 0.6em rgba(10, 2, 9, 0.45);
}
.rh-hero .rh-hero__title em {
	color: var(--rh-gold-soft);
	font-weight: 300;
	letter-spacing: -0.02em;
}
.rh-hero__aside {
	position: relative;
	grid-column: 10 / -1;
	padding: 0 0 0.6rem 1.5rem;
}
/* A single gold-leaf hairline beside the note. */
.rh-hero__aside::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.4rem;
	bottom: 0.9rem;
	width: 1px;
	background: var(--rh-gold) var(--rh-leaf) 0 0 / 64px;
	opacity: 0.8;
}
.rh-hero__aside > * {
	margin: 0;
}
.rh-hero__lede {
	font-size: 1.0625rem;
	line-height: 1.6;
	color: var(--rh-muted);
	max-width: 32ch;
}
.rh-hero .rh-hero__vara,
.rh-hero .wp-block-rivora-vara {
	margin-top: 1.25rem;
	font-size: 0.9375rem;
	color: var(--rh-cream);
}
.rh-hero .rh-actions {
	margin-top: 1.75rem;
}

@media (max-width: 1080px) {
	.rh-hero .rh-hero__title {
		grid-column: 1 / -1;
	}
	.rh-hero__aside {
		grid-column: 1 / span 7;
		margin-top: 2rem;
	}
}
@media (max-width: 781px) {
	.wp-block-cover.rh-hero {
		padding-top: calc(var(--rv-header-h, 60px) + 2rem);
		padding-bottom: 2rem;
	}
	.rh-hero .rh-hero__poster-img,
	.rh-hero .rh-hero__video {
		object-position: 50% 30%;
	}
	.rh-hero::before {
		-webkit-mask-image: radial-gradient(ellipse 70% 40% at 50% 34%, transparent 30%, #000 100%);
		mask-image: radial-gradient(ellipse 70% 40% at 50% 34%, transparent 30%, #000 100%);
	}
	.rh-hero .rh-hero__title {
		font-size: clamp(3.4rem, 15.5vw, 5.5rem);
		line-height: 0.9;
	}
	.rh-hero__aside {
		grid-column: 1 / -1;
		margin-top: 1.5rem;
		padding-left: 1.1rem;
	}
	.rh-hero__lede {
		font-size: 1rem;
	}
}

/* ------------------------------------------------------------------ */
/* 2. Fragrance chapters: silk field, arch, overlapping name           */
/* ------------------------------------------------------------------ */
.rh-chapter {
	--rh-deep: #0f2c55;
	--rh-mid: #2b6fa8;
	--rh-glow: rgba(43, 111, 168, 0.55);
	--rh-silk: url(../textures/silk-azureon.webp);
	--rh-orb: #6fa3d6;
	padding-block: clamp(6rem, 11vw, 10rem) clamp(5rem, 9vw, 8.5rem);
	background-color: var(--rh-deep);
	overflow: clip;
}
.rh-chapter--velmont {
	--rh-deep: #4e2312;
	--rh-mid: #b36a2e;
	--rh-glow: rgba(179, 106, 46, 0.5);
	--rh-silk: url(../textures/silk-velmont.webp);
	--rh-orb: #e0a15e;
}
.rh-chapter--bellasose {
	--rh-deep: #6e1f45;
	--rh-mid: #e8a2b8;
	--rh-glow: rgba(232, 162, 184, 0.4);
	--rh-silk: url(../textures/silk-bellasose.webp);
	--rh-orb: #f2c3d2;
	--rh-tone: rgba(40, 6, 26, 0.38);
}

/* Raw silk in the fragrance's colour, toned towards night at the edges, with grain. */
.rh-chapter::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -2;
	pointer-events: none;
	background:
		var(--rh-grain) 0 0 / 256px repeat,
		radial-gradient(ellipse 55% 60% at 26% 46%, var(--rh-glow), transparent 72%),
		linear-gradient(180deg, rgba(18, 4, 16, 0.55) 0%, rgba(18, 4, 16, 0.08) 22%, rgba(18, 4, 16, 0.12) 70%, rgba(18, 4, 16, 0.7) 100%),
		linear-gradient(var(--rh-tone, transparent), var(--rh-tone, transparent)),
		var(--rh-silk) 0 0 / 640px repeat,
		var(--rh-deep);
}
.rh-chapter--flip::before {
	background:
		var(--rh-grain) 0 0 / 256px repeat,
		radial-gradient(ellipse 55% 60% at 74% 46%, var(--rh-glow), transparent 72%),
		linear-gradient(180deg, rgba(18, 4, 16, 0.55) 0%, rgba(18, 4, 16, 0.08) 22%, rgba(18, 4, 16, 0.12) 70%, rgba(18, 4, 16, 0.7) 100%),
		var(--rh-silk) 0 0 / 640px repeat,
		var(--rh-deep);
}
/* Jali band along the top edge of each chapter. */
.rh-chapter::after {
	content: "";
	position: absolute;
	inset: 0 0 auto;
	height: 24px;
	z-index: -1;
	pointer-events: none;
	background: var(--rh-gold) var(--rh-leaf) 0 0 / 128px;
	-webkit-mask: url(../ornaments/jali-band.svg) 0 0 / 18px 24px repeat-x;
	mask: url(../ornaments/jali-band.svg) 0 0 / 18px 24px repeat-x;
	opacity: 0.55;
}

.rh-chapter__product {
	margin: 0;
}
.rh-chapter__grid {
	position: relative;
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	grid-template-rows: auto 1fr;
	column-gap: var(--rh-gap);
	max-width: var(--rh-max);
	margin-inline: auto;
}
.rh-chapter__grid > * {
	margin: 0;
	min-width: 0;
}

.rh-chapter__scene {
	grid-column: 1 / span 5;
	grid-row: 1 / span 2;
	align-self: start;
	z-index: 1;
}
.rh-chapter .rh-chapter__name {
	grid-column: 5 / -1;
	grid-row: 1;
	z-index: 2;
	align-self: start;
	margin: clamp(1.5rem, 7vw, 7rem) 0 0 -0.06em;
	font-size: clamp(4.25rem, 14.5vw, 14rem);
	font-weight: 300;
	line-height: 0.82;
	letter-spacing: -0.035em;
	color: var(--rh-cream);
	text-shadow: 0 0.05em 0.5em rgba(10, 2, 9, 0.35);
	pointer-events: none;
}
.rh-chapter__text {
	grid-column: 7 / span 5;
	grid-row: 2;
	padding-top: clamp(1.75rem, 3vw, 2.75rem);
}
.rh-chapter__text > * {
	margin: 0;
}
.rh-chapter__text > * + * {
	margin-top: 1.25rem;
}

/* Mirrored chapter: arch on the right, name right-aligned across its left edge. */
.rh-chapter--flip .rh-chapter__scene {
	grid-column: 8 / span 5;
}
.rh-chapter--flip .rh-chapter__name {
	grid-column: 1 / span 8;
	justify-self: end;
	text-align: right;
	margin: clamp(1.5rem, 7vw, 7rem) -0.04em 0 0;
}
.rh-chapter--flip .rh-chapter__text {
	grid-column: 2 / span 5;
}

/* Glowing planets around the arch: a small gold one and one in the fragrance's colour. */
.rh-chapter__grid::before,
.rh-chapter__grid::after {
	content: "";
	position: absolute;
	border-radius: 50%;
	pointer-events: none;
	z-index: 2;
}
.rh-chapter__grid::before {
	width: clamp(0.9rem, 1.4vw, 1.25rem);
	aspect-ratio: 1;
	left: calc(100% * 5 / 12 - 0.5rem);
	top: 9%;
	background: radial-gradient(circle at 34% 30%, #fff6dc 0, var(--rh-gold-soft) 32%, #8a6624 100%);
	box-shadow: 0 0 1.4rem 0.35rem rgba(230, 200, 138, 0.42);
}
.rh-chapter__grid::after {
	width: clamp(3.5rem, 6.5vw, 6rem);
	aspect-ratio: 1;
	left: -1.75rem;
	top: 62%;
	z-index: 0;
	background: radial-gradient(circle at 32% 28%, #fff 0, var(--rh-orb) 22%, var(--rh-deep) 78%, #050104 100%);
	box-shadow: 0 0 3rem 0.5rem var(--rh-glow);
}
.rh-chapter--flip .rh-chapter__grid::before {
	left: calc(100% * 7 / 12 - 0.5rem);
}
.rh-chapter--flip .rh-chapter__grid::after {
	left: auto;
	right: -1.75rem;
}

.rh-chapter__family {
	font-size: 0.9375rem;
	color: var(--rh-muted);
}
.rh-chapter__copy {
	font-family: var(--rh-display);
	font-size: clamp(1.4rem, 1.15rem + 0.8vw, 1.85rem);
	font-weight: 400;
	line-height: 1.3;
	letter-spacing: -0.005em;
	max-width: 30ch;
}

/* The formula: a star finial over a ruled sheet. */
.rh-chapter__text > .rh-chapter__formula {
	position: relative;
	margin-top: 2.25rem;
	padding-top: 2rem;
}
.rh-chapter__formula::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	height: 1.1rem;
	background: var(--rh-gold) var(--rh-leaf) 0 0 / 96px;
	-webkit-mask: url(../ornaments/star-divider.svg) 0 50% / auto 100% no-repeat, linear-gradient(#000, #000) 11rem 50% / 100% 1px no-repeat;
	mask: url(../ornaments/star-divider.svg) 0 50% / auto 100% no-repeat, linear-gradient(#000, #000) 11rem 50% / 100% 1px no-repeat;
	opacity: 0.85;
}
.rh-chapter .rh-chapter__formula-title {
	font-size: 1.5rem;
	font-style: italic;
	font-weight: 400;
	color: var(--rh-gold-soft);
	margin: 0 0 0.6rem;
}
.rh-chapter__formula > * {
	margin: 0;
}
.rh-chapter__formula .rv-formula :where(th, td) {
	border-bottom-color: rgba(243, 233, 220, 0.16);
}
.rh-chapter__formula .rv-formula thead :where(th, td) {
	color: var(--rh-muted);
	border-bottom-color: rgba(217, 178, 95, 0.4);
}
.rh-chapter__formula .rv-weekdays {
	margin-top: 1rem;
	font-size: 0.9375rem;
	color: var(--rh-muted);
}

.rh-chapter__text > .rh-chapter__buy {
	gap: 1rem 1.75rem;
	margin-top: 2.25rem;
}
.rh-chapter__buy > * {
	margin: 0;
}
/* Price as a gold-leaf numeral (the one place leaf touches type). */
.rh-chapter__price,
.rh-chapter__price .wc-block-components-product-price {
	font-family: var(--rh-display);
	font-size: clamp(2.25rem, 1.8rem + 1.6vw, 3.25rem);
	font-weight: 300;
	line-height: 1;
	letter-spacing: -0.01em;
	font-variant-numeric: lining-nums;
	color: var(--rh-gold-soft);
}
@supports (-webkit-background-clip: text) {
	.rh-chapter__price .wc-block-components-product-price__value,
	.rh-chapter__price .woocommerce-Price-amount {
		background: var(--rh-gold-soft) var(--rh-leaf) 0 0 / 160px;
		-webkit-background-clip: text;
		background-clip: text;
		color: transparent;
	}
}
.rh-chapter__price small,
.rh-chapter__price .woocommerce-price-suffix {
	font-family: var(--rh-sans);
	font-size: 0.8125rem;
	letter-spacing: 0;
	color: var(--rh-muted);
	-webkit-text-fill-color: currentColor;
}
.rh-chapter__add {
	margin: 0;
}
.rh-chapter__add .added_to_cart,
.rh-chapter__add .wc-block-components-product-button__added-to-cart {
	color: var(--rh-cream);
	margin-left: 1rem;
	font-size: 0.875rem;
}
.rh-chapter__text > .rh-chapter__more {
	margin-top: 1.5rem;
}

@media (max-width: 781px) {
	.rh-chapter {
		padding-block: 4.5rem 4rem;
	}
	.rh-chapter__grid {
		grid-template-columns: repeat(6, minmax(0, 1fr));
		grid-template-rows: auto auto auto;
	}
	.rh-chapter__scene,
	.rh-chapter--flip .rh-chapter__scene {
		grid-column: 1 / span 5;
		grid-row: 1;
	}
	.rh-chapter--flip .rh-chapter__scene {
		grid-column: 2 / -1;
	}
	.rh-chapter .rh-chapter__name,
	.rh-chapter--flip .rh-chapter__name {
		grid-column: 1 / -1;
		grid-row: 2;
		justify-self: start;
		text-align: left;
		margin: -0.42em 0 0 -0.04em;
		font-size: clamp(3.75rem, 21vw, 7rem);
	}
	.rh-chapter--flip .rh-chapter__name {
		justify-self: end;
		text-align: right;
	}
	.rh-chapter__text,
	.rh-chapter--flip .rh-chapter__text {
		grid-column: 1 / -1;
		grid-row: 3;
		padding-top: 1.5rem;
	}
	.rh-chapter__grid::before {
		left: auto;
		right: 10%;
		top: 4%;
	}
	.rh-chapter__grid::after,
	.rh-chapter--flip .rh-chapter__grid::after {
		left: auto;
		right: -1.5rem;
		top: 3.5rem;
		width: 3rem;
	}
	.rh-chapter--flip .rh-chapter__grid::before {
		left: 6%;
	}
	.rh-chapter--flip .rh-chapter__grid::after {
		right: auto;
		left: -1.25rem;
	}
}

/* ------------------------------------------------------------------ */
/* 3. Alignment: a cinematic night scene around the plugin block      */
/* ------------------------------------------------------------------ */
.rh-align {
	padding-block: clamp(6rem, 12vw, 11rem);
	background-color: var(--rh-night);
	overflow: clip;
}
.rh-align::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	background:
		var(--rh-grain) 0 0 / 256px repeat,
		radial-gradient(ellipse 60% 45% at 50% 62%, rgba(100, 17, 100, 0.32), transparent 70%),
		linear-gradient(180deg, var(--rh-night) 0, rgba(18, 4, 16, 0) 18%, rgba(18, 4, 16, 0) 82%, var(--rh-night) 100%),
		var(--rh-nebula) 50% 50% / cover no-repeat,
		var(--rh-night);
}
/* Star finial at the top edge, between the last chapter and the scene. */
.rh-align::after {
	content: "";
	position: absolute;
	left: 50%;
	top: clamp(2rem, 4vw, 3.25rem);
	width: 15rem;
	height: 1.5rem;
	transform: translateX(-50%);
	background: var(--rh-gold) var(--rh-leaf) 0 0 / 96px;
	-webkit-mask: url(../ornaments/star-divider.svg) 50% 50% / contain no-repeat;
	mask: url(../ornaments/star-divider.svg) 50% 50% / contain no-repeat;
	opacity: 0.8;
}
.rh-align__head {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	column-gap: var(--rh-gap);
	align-items: end;
	max-width: var(--rh-max);
	margin-inline: auto;
}
.rh-align__head > * {
	margin: 0;
}
.rh-align .rh-align__title {
	grid-column: 1 / span 8;
	font-size: clamp(3rem, 1.6rem + 5.6vw, 7.5rem);
	line-height: 0.92;
	letter-spacing: -0.025em;
}
.rh-align__lede {
	grid-column: 9 / -1;
	padding-bottom: 0.6rem;
	color: var(--rh-muted);
	max-width: 34ch;
}
.rh-align > .rh-align__stage,
.rh-align > .wp-block-rivora-alignment,
.rh-align > .wp-block-rivora-celestial-stage {
	max-width: var(--rh-max);
	margin: clamp(2.5rem, 5vw, 4.5rem) auto 0;
}
@media (max-width: 781px) {
	.rh-align .rh-align__title,
	.rh-align__lede {
		grid-column: 1 / -1;
	}
	.rh-align__lede {
		margin-top: 1.25rem;
	}
	/* The night scene runs edge to edge on phones instead of sitting inside the page gutter. */
	.rh-align > .rh-align__stage,
	.rh-align > .wp-block-rivora-alignment,
	.rh-align > .wp-block-rivora-celestial-stage {
		max-width: none;
		margin-inline: calc(50% - 50vw);
	}
}

/* ------------------------------------------------------------------ */
/* 4. Birth graha: the almanac in a temple frame on a jali field      */
/* ------------------------------------------------------------------ */
.rh-almanac {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	column-gap: var(--rh-gap);
	align-items: start;
	padding-block: var(--rh-block);
	background-color: var(--rh-ink);
	overflow: clip;
}
.rh-almanac > * {
	margin: 0;
	min-width: 0;
}
.rh-almanac::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	background: var(--rh-gold);
	opacity: 0.09;
	-webkit-mask: url(../ornaments/jali-field.svg) 0 0 / 56px repeat, radial-gradient(ellipse 60% 70% at 70% 50%, #000 20%, transparent 80%);
	-webkit-mask-composite: source-in;
	mask: url(../ornaments/jali-field.svg) 0 0 / 56px repeat, radial-gradient(ellipse 60% 70% at 70% 50%, #000 20%, transparent 80%);
	mask-composite: intersect;
}
.rh-almanac::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -2;
	pointer-events: none;
	background:
		var(--rh-grain) 0 0 / 256px repeat,
		linear-gradient(180deg, var(--rh-night) 0, rgba(18, 4, 16, 0) 22%, rgba(18, 4, 16, 0) 78%, var(--rh-night) 100%),
		radial-gradient(ellipse 50% 60% at 70% 45%, rgba(100, 17, 100, 0.45), transparent 75%),
		var(--rh-ink);
}
.rh-almanac__intro {
	grid-column: 1 / span 4;
	position: sticky;
	top: calc(var(--rv-header-h, 72px) + 2rem);
	padding-top: 3rem;
}
.rh-almanac__intro > * {
	margin: 0;
}
.rh-almanac .rh-almanac__title {
	font-size: clamp(3rem, 1.8rem + 4.4vw, 6rem);
	line-height: 0.92;
	letter-spacing: -0.025em;
}
.rh-almanac__note {
	margin-top: 1.75rem !important;
	color: var(--rh-muted);
	max-width: 36ch;
}
.rh-almanac__aside {
	margin-top: 1.25rem !important;
	font-size: 0.875rem;
	color: color-mix(in srgb, var(--rh-cream) 60%, transparent);
}

/* The frame: the plugin's almanac card sits in a soft pool of light with a jali band
   beneath it (the card draws its own border and corners). */
.rh-almanac__frame {
	grid-column: 6 / -1;
	position: relative;
	padding-bottom: 2.5rem;
}
.rh-almanac__frame::before {
	content: "";
	position: absolute;
	inset: -10% -8% 0;
	z-index: -1;
	pointer-events: none;
	background: radial-gradient(ellipse 50% 45% at 50% 40%, rgba(217, 178, 95, 0.13), transparent 70%);
}
.rh-almanac__frame::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 18px;
	background: var(--rh-gold) var(--rh-leaf) 0 0 / 96px;
	-webkit-mask: url(../ornaments/jali-band.svg) 50% 0 / 13.5px 18px repeat-x;
	mask: url(../ornaments/jali-band.svg) 50% 0 / 13.5px 18px repeat-x;
	opacity: 0.6;
}
.rh-almanac__frame > * {
	margin: 0;
}
@media (max-width: 1080px) {
	.rh-almanac__intro {
		grid-column: 1 / -1;
		position: static;
		padding-top: 0;
	}
	.rh-almanac__frame {
		grid-column: 1 / -1;
		margin-top: 3rem !important;
	}
}

/* ------------------------------------------------------------------ */
/* 5. Navagraha: nine gold-line glyphs set along an orbit             */
/* ------------------------------------------------------------------ */
.rh-grahas {
	--rh-glyph: clamp(4.5rem, 6.4vw, 6.75rem);
	padding-block: var(--rh-block);
	background-color: var(--rh-night);
	overflow: clip;
}
.rh-grahas::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	background:
		var(--rh-grain) 0 0 / 256px repeat,
		radial-gradient(ellipse 70% 50% at 50% 78%, rgba(100, 17, 100, 0.28), transparent 70%),
		var(--rh-night);
}
.rh-grahas__head {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	column-gap: var(--rh-gap);
	align-items: end;
	max-width: var(--rh-max);
	margin-inline: auto;
}
.rh-grahas__head > * {
	margin: 0;
}
.rh-grahas .rh-grahas__title {
	grid-column: 1 / span 7;
	grid-row: 1 / span 2;
	font-size: clamp(3rem, 1.6rem + 5vw, 7rem);
	line-height: 0.92;
	letter-spacing: -0.025em;
}
.rh-grahas__note {
	grid-column: 9 / -1;
	color: var(--rh-muted);
	max-width: 36ch;
}
.rh-grahas__more {
	grid-column: 9 / -1;
	margin-top: 1rem !important;
	padding-bottom: 0.5rem;
}

.rh-grahas__band {
	position: relative;
	display: grid;
	grid-template-columns: repeat(9, minmax(0, 1fr));
	column-gap: clamp(0.5rem, 1.2vw, 1.25rem);
	max-width: var(--rh-max);
	margin: clamp(4rem, 8vw, 7rem) auto 0;
	padding: 0;
	list-style: none;
}
/* The orbit: the top of a wide ellipse, passing through each glyph's centre. */
.rh-grahas__band::before {
	content: "";
	position: absolute;
	left: -5%;
	right: -5%;
	top: calc(var(--rh-glyph) / 2);
	height: 40rem;
	border-top: 1px solid rgba(217, 178, 95, 0.38);
	border-radius: 50%;
	pointer-events: none;
}
.rh-graha {
	position: relative;
	margin: 0 !important;
	padding: 0;
	text-align: center;
	/* A night disc behind the glyph hides the orbit line inside it. */
	background: radial-gradient(circle at 50% calc(var(--rh-glyph) / 2), var(--rh-night) calc(var(--rh-glyph) / 2 - 1px), transparent calc(var(--rh-glyph) / 2)) no-repeat;
}
.rh-graha::before {
	content: "";
	display: block;
	width: var(--rh-glyph);
	aspect-ratio: 1;
	margin: 0 auto 1.1rem;
	background: var(--rh-gold) var(--rh-leaf) 0 0 / 128px;
	-webkit-mask: url(../ornaments/grahas.svg#surya) 50% 50% / contain no-repeat;
	mask: url(../ornaments/grahas.svg#surya) 50% 50% / contain no-repeat;
}
.rh-graha--chandra::before { -webkit-mask-image: url(../ornaments/grahas.svg#chandra); mask-image: url(../ornaments/grahas.svg#chandra); }
.rh-graha--mangal::before { -webkit-mask-image: url(../ornaments/grahas.svg#mangal); mask-image: url(../ornaments/grahas.svg#mangal); }
.rh-graha--budh::before { -webkit-mask-image: url(../ornaments/grahas.svg#budh); mask-image: url(../ornaments/grahas.svg#budh); }
.rh-graha--guru::before { -webkit-mask-image: url(../ornaments/grahas.svg#guru); mask-image: url(../ornaments/grahas.svg#guru); }
.rh-graha--shukra::before { -webkit-mask-image: url(../ornaments/grahas.svg#shukra); mask-image: url(../ornaments/grahas.svg#shukra); }
.rh-graha--shani::before { -webkit-mask-image: url(../ornaments/grahas.svg#shani); mask-image: url(../ornaments/grahas.svg#shani); }
.rh-graha--rahu::before { -webkit-mask-image: url(../ornaments/grahas.svg#rahu); mask-image: url(../ornaments/grahas.svg#rahu); }
.rh-graha--ketu::before { -webkit-mask-image: url(../ornaments/grahas.svg#ketu); mask-image: url(../ornaments/grahas.svg#ketu); }

/* Positions on the arc (ellipse a = 0.55 band width, b = 20rem). */
@media (min-width: 1081px) {
	.rh-graha:nth-child(1),
	.rh-graha:nth-child(9) { padding-top: 8.2rem; }
	.rh-graha:nth-child(2),
	.rh-graha:nth-child(8) { padding-top: 4.1rem; }
	.rh-graha:nth-child(3),
	.rh-graha:nth-child(7) { padding-top: 1.7rem; }
	.rh-graha:nth-child(4),
	.rh-graha:nth-child(6) { padding-top: 0.42rem; }
	.rh-graha {
		background-position: 0 var(--rh-arc, 0);
	}
	.rh-graha:nth-child(1),
	.rh-graha:nth-child(9) { --rh-arc: 8.2rem; }
	.rh-graha:nth-child(2),
	.rh-graha:nth-child(8) { --rh-arc: 4.1rem; }
	.rh-graha:nth-child(3),
	.rh-graha:nth-child(7) { --rh-arc: 1.7rem; }
	.rh-graha:nth-child(4),
	.rh-graha:nth-child(6) { --rh-arc: 0.42rem; }
}
.rh-graha > * {
	margin: 0;
}
.rh-graha__name {
	font-family: var(--rh-display);
	font-size: clamp(1.4rem, 1.1rem + 0.8vw, 1.85rem);
	font-weight: 400;
	line-height: 1.1;
}
.rh-graha__meta {
	margin-top: 0.3rem !important;
	font-size: 0.8125rem;
	line-height: 1.4;
	color: var(--rh-muted);
}
.rh-graha__quality {
	margin-top: 0.4rem !important;
	font-family: var(--rh-display);
	font-style: italic;
	font-size: 1.0625rem;
	line-height: 1.25;
	color: var(--rh-gold-soft);
}
@media (max-width: 1080px) {
	.rh-grahas {
		--rh-glyph: clamp(4.25rem, 16vw, 5.5rem);
	}
	.rh-grahas .rh-grahas__title,
	.rh-grahas__note,
	.rh-grahas__more {
		grid-column: 1 / -1;
		grid-row: auto;
	}
	.rh-grahas__note {
		margin-top: 1.5rem !important;
	}
	.rh-grahas__band {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		row-gap: 2.75rem;
	}
	.rh-grahas__band::before {
		display: none;
	}
}

/* ------------------------------------------------------------------ */
/* 6. Story: the trio in a tall arch on a plum field                  */
/* ------------------------------------------------------------------ */
.rh-story {
	padding-block: var(--rh-block);
	background-color: var(--rh-plum);
	overflow: clip;
}
.rh-story::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -2;
	pointer-events: none;
	background:
		var(--rh-grain) 0 0 / 256px repeat,
		radial-gradient(ellipse 50% 60% at 22% 48%, rgba(217, 178, 95, 0.14), transparent 70%),
		linear-gradient(165deg, #2a0a27 0%, #4a0d4a 38%, #641164 62%, #2a0a27 100%);
}
.rh-story::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	background: var(--rh-gold);
	opacity: 0.07;
	-webkit-mask: url(../ornaments/jali-field.svg) 0 0 / 56px repeat, linear-gradient(90deg, transparent 30%, #000 100%);
	-webkit-mask-composite: source-in;
	mask: url(../ornaments/jali-field.svg) 0 0 / 56px repeat, linear-gradient(90deg, transparent 30%, #000 100%);
	mask-composite: intersect;
}
.rh-story__grid {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	grid-template-rows: auto 1fr;
	column-gap: var(--rh-gap);
	max-width: var(--rh-max);
	margin-inline: auto;
}
.rh-story__grid > * {
	margin: 0;
	min-width: 0;
}
.rh-story__media {
	grid-column: 2 / span 4;
	grid-row: 1 / span 2;
}
.rh-story .rh-story__media img {
	object-position: 50% 60%;
}
.rh-story .rh-story__statement {
	grid-column: 5 / -1;
	grid-row: 1;
	z-index: 2;
	margin-top: clamp(2rem, 8vw, 8rem);
	font-size: clamp(3rem, 1.4rem + 5.2vw, 7rem);
	line-height: 0.94;
	letter-spacing: -0.025em;
	text-shadow: 0 0.05em 0.5em rgba(10, 2, 9, 0.4);
}
.rh-story__body {
	grid-column: 8 / span 4;
	grid-row: 2;
	padding-top: 2.5rem;
	color: color-mix(in srgb, var(--rh-cream) 86%, transparent);
}
.rh-story__body > * {
	margin: 0;
}
.rh-story__body > * + * {
	margin-top: 1.1rem;
}
.rh-story__body .rh-link {
	margin-top: 1.75rem;
	color: var(--rh-cream);
}
@media (max-width: 781px) {
	.rh-story__grid {
		grid-template-columns: repeat(6, minmax(0, 1fr));
	}
	.rh-story__media {
		grid-column: 1 / span 5;
		grid-row: 1;
	}
	.rh-story .rh-story__statement {
		grid-column: 1 / -1;
		grid-row: 2;
		margin-top: -0.6em;
	}
	.rh-story__body {
		grid-column: 1 / -1;
		grid-row: 3;
	}
}

/* ------------------------------------------------------------------ */
/* Other Rivora patterns                                               */
/* ------------------------------------------------------------------ */

/* Celestial stage / Navagraha grid blocks when placed in the older patterns. */
.rh-stage,
.rh-navagraha,
.rh-collection {
	padding-block: var(--rh-block);
}
.rh-head {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	column-gap: var(--rh-gap);
	align-items: end;
	max-width: var(--rh-max);
	margin: 0 auto clamp(2.5rem, 5vw, 4rem);
}
.rh-head > * {
	margin: 0;
}
.rh-head__title {
	grid-column: 1 / span 7;
	font-size: clamp(2.75rem, 1.6rem + 4vw, 5.5rem);
}
.rh-head__note {
	grid-column: 9 / -1;
	color: var(--rh-muted);
}
@media (max-width: 781px) {
	.rh-head__title,
	.rh-head__note {
		grid-column: 1 / -1;
	}
	.rh-head__note {
		margin-top: 1rem;
	}
}
.rh-stage > .wp-block-rivora-celestial-stage,
.rh-navagraha > .wp-block-rivora-navagraha-grid {
	max-width: var(--rh-max);
	margin-inline: auto;
}
.rh-collection__grid {
	max-width: var(--rh-max);
	margin-inline: auto;
}
.rh-collection__name {
	font-size: 1.75rem;
	margin-top: 1rem;
}
.rh-collection__name a {
	text-decoration: none;
}

/* Inner page header pattern: nebula, an arch outline, a jali band. */
.rh-page-header {
	padding-block: calc(var(--rv-header-h, 72px) + clamp(3rem, 7vw, 6rem)) clamp(3.5rem, 6vw, 5.5rem);
	overflow: clip;
}
.rh-page-header::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background:
		var(--rh-grain) 0 0 / 256px repeat,
		linear-gradient(180deg, rgba(18, 4, 16, 0.2), var(--rh-night) 100%),
		var(--rh-nebula) 50% 40% / cover no-repeat,
		var(--rh-night);
}
.rh-page-header::after {
	content: "";
	position: absolute;
	inset: auto 0 0;
	height: 24px;
	background: var(--rh-gold) var(--rh-leaf) 0 0 / 128px;
	-webkit-mask: url(../ornaments/jali-band.svg) 0 0 / 18px 24px repeat-x;
	mask: url(../ornaments/jali-band.svg) 0 0 / 18px 24px repeat-x;
	opacity: 0.6;
}
.rh-page-header > * {
	max-width: var(--rh-max);
	margin-inline: auto !important;
}
.rh-page-header .rh-page-header__title {
	font-size: var(--wp--preset--font-size--display);
	line-height: 0.92;
	letter-spacing: -0.025em;
}
.rh-page-header__intro {
	margin-top: 1.5rem !important;
	color: var(--rh-muted);
	max-width: 46ch;
	margin-left: 0 !important;
}

/* ------------------------------------------------------------------ */
/* Motion: scroll-driven, compositor-only, progressive                 */
/* ------------------------------------------------------------------ */
@media (prefers-reduced-motion: no-preference) {
	@supports (animation-timeline: view()) {
		/* Chapter names drift against the arch as the chapter passes. */
		.rh-chapter .rh-chapter__name {
			animation: rh-drift linear both;
			animation-timeline: view();
			animation-range: entry 10% exit 20%;
		}
		.rh-chapter--flip .rh-chapter__name {
			animation-name: rh-drift-back;
		}
		.rh-chapter__scene,
		.rh-story__media {
			animation: rh-rise linear both;
			animation-timeline: view();
			animation-range: entry 0% cover 30%;
		}
		.rh-graha {
			animation: rh-fade linear both;
			animation-timeline: view();
			animation-range: entry 0% cover 25%;
		}
		.rh-hero__grid {
			animation: rh-lift linear both;
			animation-timeline: scroll(root);
			animation-range: 0 100vh;
		}
	}
}
@keyframes rh-drift {
	from { transform: translate3d(3.5rem, 0, 0); }
	to { transform: translate3d(-2.5rem, 0, 0); }
}
@keyframes rh-drift-back {
	from { transform: translate3d(-3.5rem, 0, 0); }
	to { transform: translate3d(2.5rem, 0, 0); }
}
@keyframes rh-rise {
	from { opacity: 0.25; transform: translate3d(0, 3rem, 0) scale(0.97); }
	to { opacity: 1; transform: none; }
}
@keyframes rh-fade {
	from { opacity: 0; transform: translate3d(0, 1.5rem, 0); }
	to { opacity: 1; transform: none; }
}
@keyframes rh-lift {
	from { opacity: 1; transform: none; }
	to { opacity: 0; transform: translate3d(0, -12vh, 0); }
}