/* MHRF Diwali Experience. Every selector is namespaced under .mhrf-diwali. */

.mhrf-diwali {
	scroll-margin-top: calc(var(--v2-header-height, 76px) + 8px);
	--mhrf-diwali-t: 1;
	--mhrf-diwali-gold: #d9b25f;
	--mhrf-diwali-gold-light: #f6e3b4;
	--mhrf-diwali-ease: cubic-bezier(0.22, 0.61, 0.36, 1);
	position: relative;
	display: block;
	width: 100%;
	min-height: 400px;
	overflow: hidden;
	isolation: isolate;
	box-sizing: border-box;
	padding: 56px 24px;
	background:
		radial-gradient(ellipse 60% 90% at 22% 55%, rgba(120, 40, 70, 0.55), transparent 70%),
		linear-gradient(120deg, #170a2b 0%, #26103a 50%, #3a0f27 100%);
	color: #efe4d2;
}

.mhrf-diwali::before {
	content: "";
	position: absolute;
	left: 0;
	right: calc(var(--mhrf-diwali-tab-w, 0px) + 18px);
	top: 0;
	height: 1px;
	z-index: 3;
	background: linear-gradient(90deg, transparent 0%, rgba(217, 178, 95, 0.4) 25%, rgba(240, 216, 140, 0.8) 60%, rgba(240, 216, 140, 0.8) 100%);
}

.mhrf-diwali *,
.mhrf-diwali *::before,
.mhrf-diwali *::after {
	box-sizing: border-box;
}

.mhrf-diwali__mandala {
	position: absolute;
	pointer-events: none;
}

.mhrf-diwali__mandala {
	left: 50%;
	top: 45%;
	width: 560px;
	height: 560px;
	margin: -280px 0 0 -280px;
	background: url("../images/mandala.svg") center / contain no-repeat;
	opacity: 0.1;
	z-index: 0;
}

.mhrf-diwali__inner {
	position: relative;
	z-index: 2;
	display: grid;
	grid-template-columns: 240px minmax(0, 560px);
	align-items: center;
	justify-content: center;
	gap: 64px;
	max-width: 1100px;
	margin: 0 auto;
}

/* Diya */
.mhrf-diwali__art {
	position: relative;
	width: 240px;
	aspect-ratio: 240 / 210;
}

.mhrf-diwali__diya {
	position: relative;
	display: block;
	width: 100%;
	height: auto;
	overflow: visible;
}

.mhrf-diwali__glow {
	position: absolute;
	left: 50%;
	top: 30%;
	width: 620px;
	height: 620px;
	margin: -310px 0 0 -310px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(255, 176, 70, 0.34) 0%, rgba(214, 120, 50, 0.14) 38%, transparent 68%);
	opacity: 0.8;
	pointer-events: none;
	will-change: transform, opacity;
}

.mhrf-diwali__flame {
	transform-origin: 120px 96px;
}

.mhrf-diwali__flame-body,
.mhrf-diwali__flame-core {
	transform-origin: 120px 96px;
}

.mhrf-diwali__rays {
	position: absolute;
	left: 50%;
	top: 30%;
	width: 1500px;
	height: 1500px;
	margin: -750px 0 0 -750px;
	pointer-events: none;
	-webkit-mask-image: radial-gradient(circle, #000 0%, rgba(0, 0, 0, 0.5) 26%, transparent 52%);
	mask-image: radial-gradient(circle, #000 0%, rgba(0, 0, 0, 0.5) 26%, transparent 52%);
}

.mhrf-diwali__rays::before,
.mhrf-diwali-edge__rays::before {
	content: "";
	position: absolute;
	inset: 0;
	background: conic-gradient(from 200deg, transparent 0deg, rgba(255, 196, 110, 0.2) 10deg, transparent 24deg, transparent 38deg, rgba(255, 196, 110, 0.14) 50deg, transparent 68deg, transparent 84deg, rgba(255, 196, 110, 0.18) 96deg, transparent 116deg, transparent 134deg, rgba(255, 196, 110, 0.12) 146deg, transparent 166deg, transparent 360deg);
}

.mhrf-diwali-holder {
	position: relative;
	z-index: 85;
}

/* A folder tab, flush with the right edge, that rises out of the banner and stands for the whole of it.
   Its fill is sampled from the banner gradient (see matchTab in the script) and a single gold line runs along
   the banner's top edge, up the tab's side and across its top, so tab and banner read as one shape. */
.mhrf-diwali__tab {
	--tab-bg: var(--mhrf-diwali-tab-bg, #340f2d);
	position: absolute;
	right: 0;
	bottom: 100%;
	z-index: 4;
	display: inline-flex;
	align-items: center;
	gap: 0.85rem;
	height: 54px;
	margin-bottom: -1px;
	padding: 0 2.2rem 0 1.7rem;
	border-radius: 20px 0 0 0;
	background: var(--tab-bg);
	box-shadow: 0 -10px 24px rgba(10, 3, 24, 0.3);
	font-family: "Poppins", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 0.92rem;
	font-weight: 600;
	letter-spacing: 0.26em;
	line-height: 1;
	text-decoration: none;
	white-space: nowrap;
	transition: filter 0.3s ease;
}

/* The tab's left outline, with the curved fillet that carries the banner's top line up into the tab */
.mhrf-diwali__tab::before {
	content: "";
	position: absolute;
	left: -18px;
	top: 0;
	bottom: 0;
	width: 40px;
	background:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 54' width='40' height='54'%3E%3Cpath d='M0 53.500A18 18 0 0 0 18 36V20A20 20 0 0 1 38 .5H40' fill='none' stroke='%23f0d88c' stroke-opacity='.8' stroke-width='1'/%3E%3C/svg%3E") 0 100% / 40px 54px no-repeat,
		radial-gradient(circle at 0 0, transparent 18px, var(--tab-bg) 18.5px) 0 100% / 18px 18px no-repeat;
}

/* The gold line across the top of the tab */
.mhrf-diwali__tab::after {
	content: "";
	position: absolute;
	left: 21px;
	right: 0;
	top: 0;
	height: 1px;
	background: rgba(240, 216, 140, 0.8);
}

.mhrf-diwali__tab span {
	background: linear-gradient(100deg, #f6e3b4 0%, #e9c978 50%, #f6e3b4 100%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	color: #f6e3b4;
}

.mhrf-diwali__tab:hover {
	filter: brightness(1.15);
}

.mhrf-diwali__tab svg {
	display: block;
	flex-shrink: 0;
	width: 30px;
	height: 27px;
	filter: drop-shadow(0 0 7px rgba(255, 170, 70, 0.8));
}

.mhrf-diwali__tab-flame {
	transform-origin: 12px 10px;
}

@media (prefers-reduced-motion: no-preference) {
	.mhrf-diwali__tab-flame {
		animation: mhrf-diwali-flicker 2.4s ease-in-out infinite;
	}
}

@media (max-width: 639px) {
	.mhrf-diwali__tab {
		height: 42px;
		gap: 0.6rem;
		padding: 0 1.3rem 0 1.1rem;
		border-radius: 16px 0 0 0;
		font-size: 0.72rem;
		letter-spacing: 0.2em;
	}

	.mhrf-diwali__tab::before {
		left: -14px;
		width: 32px;
		background:
			url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 42' width='32' height='42'%3E%3Cpath d='M0 41.500A14 14 0 0 0 14 28V16A16 16 0 0 1 30 .5H32' fill='none' stroke='%23f0d88c' stroke-opacity='.8' stroke-width='1'/%3E%3C/svg%3E") 0 100% / 32px 42px no-repeat,
			radial-gradient(circle at 0 0, transparent 14px, var(--tab-bg) 14.5px) 0 100% / 14px 14px no-repeat;
	}

	.mhrf-diwali__tab::after {
		left: 17px;
	}

	.mhrf-diwali::before {
		right: calc(var(--mhrf-diwali-tab-w, 0px) + 14px);
	}

	.mhrf-diwali__tab svg {
		width: 22px;
		height: 20px;
	}
}

@keyframes mhrf-diwali-tab-rise {
	from {
		clip-path: inset(100% 0 0 -24px);
	}

	to {
		clip-path: inset(-40px 0 0 -24px);
	}
}

@keyframes mhrf-diwali-tab-lit {
	0% {
		filter: brightness(1);
	}

	25% {
		filter: brightness(1.45);
	}

	100% {
		filter: brightness(1);
	}
}

/* Copy */
.mhrf-diwali__lines {
	margin: 0 0 20px;
	font-family: "Poppins", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: clamp(0.72rem, 1.1vw, 0.88rem);
	font-weight: 500;
	line-height: 1.9;
	letter-spacing: 0.32em;
	color: var(--mhrf-diwali-gold);
	text-transform: uppercase;
}

.mhrf-diwali__line {
	display: block;
}

.mhrf-diwali__message {
	margin: 0 0 28px;
	max-width: 30em;
	font-family: Georgia, "Times New Roman", serif;
	font-size: clamp(1.1rem, 1.7vw, 1.35rem);
	font-style: italic;
	line-height: 1.6;
	color: #eadfcf;
}

.mhrf-diwali__greeting {
	margin: 0 0 12px;
	font-family: Georgia, "Times New Roman", serif;
	font-size: clamp(1.6rem, 3.4vw, 2.6rem);
	font-weight: 400;
	line-height: 1.1;
	letter-spacing: 0.12em;
	white-space: nowrap;
	color: var(--mhrf-diwali-gold-light);
}

.mhrf-diwali__from {
	margin: 0 0 22px;
	font-family: "Poppins", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 0.875rem;
	letter-spacing: 0.04em;
	color: #cdbfae;
}

.mhrf-diwali__logo {
	display: block;
	width: auto;
	height: 40px;
	opacity: 0.9;
}

/* Tablet */
@media (max-width: 991px) {
	.mhrf-diwali {
		padding: 48px 24px;
	}

	.mhrf-diwali__inner {
		grid-template-columns: 180px minmax(0, 1fr);
		gap: 40px;
	}

	.mhrf-diwali__art {
		width: 180px;
	}

	.mhrf-diwali__rays {
		width: 1100px;
		height: 1100px;
		margin: -550px 0 0 -550px;
	}

	.mhrf-diwali__glow {
		width: 460px;
		height: 460px;
		margin: -230px 0 0 -230px;
	}

	.mhrf-diwali__mandala {
		width: 420px;
		height: 420px;
		margin: -210px 0 0 -210px;
	}
}

/* Mobile: stacked, diya stays the focal point */
@media (max-width: 639px) {
	.mhrf-diwali {
		min-height: 0;
		padding: 40px 20px 44px;
	}

	.mhrf-diwali__inner {
		grid-template-columns: minmax(0, 1fr);
		justify-items: center;
		gap: 28px;
		text-align: center;
	}

	.mhrf-diwali__art {
		width: 150px;
	}

	.mhrf-diwali__rays {
		width: 760px;
		height: 760px;
		margin: -380px 0 0 -380px;
	}

	.mhrf-diwali__glow {
		width: 360px;
		height: 360px;
		margin: -180px 0 0 -180px;
	}

	.mhrf-diwali__mandala {
		width: 360px;
		height: 360px;
		margin: -180px 0 0 -180px;
	}

	.mhrf-diwali__lines {
		letter-spacing: 0.24em;
	}

	.mhrf-diwali__message {
		margin-left: auto;
		margin-right: auto;
	}

	.mhrf-diwali__logo {
		margin: 0 auto;
		height: 34px;
	}
}

/* Gold shimmer on the final greeting, where supported */
@supports ((-webkit-background-clip: text) or (background-clip: text)) {
	.mhrf-diwali__greeting {
		background: linear-gradient(100deg, #cfa64f 0%, #f6e3b4 40%, #cfa64f 80%) 0 0 / 220% 100%;
		-webkit-background-clip: text;
		background-clip: text;
		-webkit-text-fill-color: transparent;
		color: transparent;
		background-position: 100% 0;
	}
}

/*
 * Animation. Only applied when scripting is running and motion is allowed, so the default
 * (no JS, reduced motion, static mode) is the finished composition.
 * Timeline (at the default 7.5s): awakening 0-2s, light 2-4s, message 4-6s, finale 6-8s.
 */
@media (prefers-reduced-motion: no-preference) {
	.mhrf-diwali.is-armed:not(.is-static) .mhrf-diwali__lines .mhrf-diwali__line,
	.mhrf-diwali.is-armed:not(.is-static) .mhrf-diwali__message,
	.mhrf-diwali.is-armed:not(.is-static) .mhrf-diwali__greeting,
	.mhrf-diwali.is-armed:not(.is-static) .mhrf-diwali__from,
	.mhrf-diwali.is-armed:not(.is-static) .mhrf-diwali__logo,
	.mhrf-diwali.is-armed:not(.is-static) .mhrf-diwali__diya,
	.mhrf-diwali.is-armed:not(.is-static) .mhrf-diwali__mandala,
	.mhrf-diwali.is-armed:not(.is-static) .mhrf-diwali__rays,
	.mhrf-diwali.is-armed:not(.is-static) .mhrf-diwali__glow {
		opacity: 0;
	}

	.mhrf-diwali.is-armed:not(.is-static) .mhrf-diwali__flame {
		transform: scale(0);
	}

	.mhrf-diwali.is-playing .mhrf-diwali__mandala {
		animation: mhrf-diwali-mandala calc(var(--mhrf-diwali-t) * 2.4s) var(--mhrf-diwali-ease) both;
	}

	.mhrf-diwali.is-playing .mhrf-diwali__glow {
		animation: mhrf-diwali-glow calc(var(--mhrf-diwali-t) * 7s) var(--mhrf-diwali-ease) both, mhrf-diwali-lamp 4.3s ease-in-out calc(var(--mhrf-diwali-t) * 7s) infinite;
	}

	.mhrf-diwali.is-playing .mhrf-diwali__rays {
		animation: mhrf-diwali-fade calc(var(--mhrf-diwali-t) * 3s) var(--mhrf-diwali-ease) calc(var(--mhrf-diwali-t) * 3.6s) both;
	}


	.mhrf-diwali.is-playing .mhrf-diwali__diya {
		animation: mhrf-diwali-fade calc(var(--mhrf-diwali-t) * 1.4s) var(--mhrf-diwali-ease) calc(var(--mhrf-diwali-t) * 1.7s) both;
	}

	.mhrf-diwali.is-playing .mhrf-diwali__flame {
		animation: mhrf-diwali-ignite calc(var(--mhrf-diwali-t) * 1s) var(--mhrf-diwali-ease) calc(var(--mhrf-diwali-t) * 2.1s) both;
	}

	.mhrf-diwali.is-playing .mhrf-diwali__flame-body {
		animation: mhrf-diwali-flicker 2.6s ease-in-out calc(var(--mhrf-diwali-t) * 3.1s) infinite;
	}

	.mhrf-diwali.is-playing .mhrf-diwali__flame-core {
		animation: mhrf-diwali-flicker 1.9s ease-in-out calc(var(--mhrf-diwali-t) * 3.1s) infinite reverse;
	}

	.mhrf-diwali.is-playing .mhrf-diwali__flame-halo {
		animation: mhrf-diwali-halo 3.1s ease-in-out calc(var(--mhrf-diwali-t) * 3.1s) infinite;
	}

	.mhrf-diwali.is-playing .mhrf-diwali__line--1 {
		animation: mhrf-diwali-rise calc(var(--mhrf-diwali-t) * 2s) var(--mhrf-diwali-ease) calc(var(--mhrf-diwali-t) * 2.2s) both;
	}

	.mhrf-diwali.is-playing .mhrf-diwali__line--2 {
		animation: mhrf-diwali-rise calc(var(--mhrf-diwali-t) * 2s) var(--mhrf-diwali-ease) calc(var(--mhrf-diwali-t) * 2.45s) both;
	}

	.mhrf-diwali.is-playing .mhrf-diwali__message {
		animation: mhrf-diwali-rise calc(var(--mhrf-diwali-t) * 2s) var(--mhrf-diwali-ease) calc(var(--mhrf-diwali-t) * 2.7s) both;
	}

	.mhrf-diwali.is-playing .mhrf-diwali__greeting {
		animation:
			mhrf-diwali-rise calc(var(--mhrf-diwali-t) * 2s) var(--mhrf-diwali-ease) calc(var(--mhrf-diwali-t) * 2.95s) both,
			mhrf-diwali-shimmer calc(var(--mhrf-diwali-t) * 1.8s) ease-in-out calc(var(--mhrf-diwali-t) * 4.2s) both;
	}

	.mhrf-diwali.is-playing .mhrf-diwali__from {
		animation: mhrf-diwali-rise calc(var(--mhrf-diwali-t) * 2s) var(--mhrf-diwali-ease) calc(var(--mhrf-diwali-t) * 3.2s) both;
	}

	.mhrf-diwali.is-playing .mhrf-diwali__logo {
		animation: mhrf-diwali-fade-logo calc(var(--mhrf-diwali-t) * 2s) var(--mhrf-diwali-ease) calc(var(--mhrf-diwali-t) * 3.4s) both;
	}

	/* Stop the ambient loops while the section is off screen or the tab is hidden */
	.mhrf-diwali.is-paused .mhrf-diwali__glow,
	.mhrf-diwali.is-paused .mhrf-diwali__flame-body,
	.mhrf-diwali.is-paused .mhrf-diwali__flame-core,
	.mhrf-diwali.is-paused .mhrf-diwali__flame-halo {
		animation-play-state: paused;
	}
}

@keyframes mhrf-diwali-mandala {
	from {
		opacity: 0;
		transform: scale(0.94);
	}

	to {
		opacity: 0.1;
		transform: scale(1);
	}
}

@keyframes mhrf-diwali-glow {
	0% {
		opacity: 0;
		transform: scale(0.55);
	}

	30% {
		opacity: 0.45;
		transform: scale(0.65);
	}

	58% {
		opacity: 0.55;
		transform: scale(0.72);
	}

	100% {
		opacity: 0.85;
		transform: scale(1);
	}
}

@keyframes mhrf-diwali-fade {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

@keyframes mhrf-diwali-fade-logo {
	from {
		opacity: 0;
	}

	to {
		opacity: 0.9;
	}
}

@keyframes mhrf-diwali-ignite {
	0% {
		transform: scale(0);
	}

	60% {
		transform: scale(1.12);
	}

	100% {
		transform: scale(1);
	}
}

@keyframes mhrf-diwali-flicker {
	0%,
	100% {
		transform: scale(1, 1) skewX(0deg);
	}

	25% {
		transform: scale(0.97, 1.04) skewX(1.5deg);
	}

	55% {
		transform: scale(1.02, 0.96) skewX(-1.5deg);
	}

	80% {
		transform: scale(0.98, 1.03) skewX(0.8deg);
	}
}

@keyframes mhrf-diwali-halo {
	0%,
	100% {
		opacity: 1;
	}

	50% {
		opacity: 0.72;
	}
}

@keyframes mhrf-diwali-rise {
	from {
		opacity: 0;
		transform: translate3d(0, 14px, 0);
	}

	to {
		opacity: 1;
		transform: translate3d(0, 0, 0);
	}
}

@keyframes mhrf-diwali-shimmer {
	from {
		background-position: 100% 0;
	}

	to {
		background-position: 0 0;
	}
}

/* Hero: fireworks on load that end on the folder tab, then warm light along the bottom edge */
.mhrf-diwali-edge {
	position: absolute;
	inset: 0;
	z-index: 2;
	pointer-events: none;
	overflow: hidden;
}

.mhrf-diwali-edge__fireworks {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}

.mhrf-diwali-edge::before {
	content: "";
	position: absolute;
	inset: 0;
	background: radial-gradient(circle at 90% 100%, rgba(255, 214, 150, 0.45) 0%, rgba(255, 170, 70, 0.14) 26%, transparent 50%);
	opacity: 0;
}

@media (prefers-reduced-motion: no-preference) {
	.mhrf-diwali-edge.is-title::before {
		animation: mhrf-diwali-flash 1.1s ease-out both;
	}
}

.mhrf-diwali-edge__glow {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: clamp(90px, 14vh, 160px);
	background: radial-gradient(ellipse 55% 100% at 50% 100%, rgba(255, 176, 70, 0.26) 0%, rgba(230, 130, 50, 0.12) 45%, transparent 75%);
}

@media (prefers-reduced-motion: no-preference) {
	.mhrf-diwali-edge:not(.is-ready) .mhrf-diwali-edge__glow {
		opacity: 0;
	}

	.mhrf-diwali-edge.is-ready .mhrf-diwali-edge__glow {
		animation: mhrf-diwali-fade 2.4s var(--mhrf-diwali-ease, ease-out) both, mhrf-diwali-lamp 6s ease-in-out 2.4s infinite;
	}
}

@keyframes mhrf-diwali-flash {
	0% {
		opacity: 0;
	}

	18% {
		opacity: 1;
	}

	100% {
		opacity: 0;
	}
}

@keyframes mhrf-diwali-lamp {
	0%,
	100% {
		opacity: 1;
	}

	18% {
		opacity: 0.93;
	}

	37% {
		opacity: 0.99;
	}

	61% {
		opacity: 0.9;
	}

	82% {
		opacity: 0.97;
	}
}

/* ------------------------------------------------------------------
 * Deepavali banner, bolder: a larger diya, stronger light and rays, a visible
 * mandala, an ignition ripple, rising embers, twinkling gold specks and a letter-by-letter greeting.
 * ---------------------------------------------------------------- */
.mhrf-diwali {
	--mhrf-diwali-track: 0.32em;
}

.mhrf-diwali__inner {
	grid-template-columns: 280px minmax(0, 640px);
	gap: 72px;
	max-width: 1180px;
}

.mhrf-diwali__art {
	width: 280px;
}

.mhrf-diwali__mandala {
	width: 640px;
	height: 640px;
	margin: -320px 0 0 -320px;
	opacity: 0.24;
}

.mhrf-diwali__glow {
	background: radial-gradient(circle, rgba(255, 184, 80, 0.55) 0%, rgba(230, 130, 50, 0.24) 32%, transparent 66%);
}

.mhrf-diwali__rays::before {
	background: conic-gradient(from 200deg, transparent 0deg, rgba(255, 200, 120, 0.34) 10deg, transparent 26deg, transparent 38deg, rgba(255, 200, 120, 0.24) 50deg, transparent 70deg, transparent 84deg, rgba(255, 200, 120, 0.3) 96deg, transparent 118deg, transparent 134deg, rgba(255, 200, 120, 0.2) 146deg, transparent 168deg, transparent 360deg);
}

.mhrf-diwali__ring {
	position: absolute;
	left: 50%;
	top: 30%;
	width: 140px;
	height: 140px;
	margin: -70px 0 0 -70px;
	border: 2px solid rgba(255, 218, 160, 0.9);
	border-radius: 50%;
	box-shadow: 0 0 24px rgba(255, 176, 70, 0.6), inset 0 0 24px rgba(255, 176, 70, 0.4);
	opacity: 0;
	pointer-events: none;
}

.mhrf-diwali__ember {
	position: absolute;
	left: 50%;
	top: 12%;
	width: 4px;
	height: 4px;
	margin-left: -2px;
	border-radius: 50%;
	background: #ffd88a;
	box-shadow: 0 0 8px 2px rgba(255, 176, 70, 0.8);
	opacity: 0;
	pointer-events: none;
}

.mhrf-diwali__ember:nth-of-type(1) { --dx: -34px; --d: 3.2s; }
.mhrf-diwali__ember:nth-of-type(2) { --dx: 26px; --d: 3.8s; }
.mhrf-diwali__ember:nth-of-type(3) { --dx: -12px; --d: 4.2s; }
.mhrf-diwali__ember:nth-of-type(4) { --dx: 40px; --d: 3.4s; }
.mhrf-diwali__ember:nth-of-type(5) { --dx: -44px; --d: 4s; }
.mhrf-diwali__ember:nth-of-type(6) { --dx: 12px; --d: 3.6s; }
.mhrf-diwali__ember:nth-of-type(7) { --dx: 30px; --d: 4.4s; }

/* A scatter of gold specks across the banner that twinkle */
.mhrf-diwali::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	opacity: 0.55;
	background:
		radial-gradient(circle at 9% 18%, rgba(255, 232, 175, 0.95) 0 1.6px, transparent 2.8px),
		radial-gradient(circle at 21% 78%, rgba(255, 232, 175, 0.9) 0 1.4px, transparent 2.6px),
		radial-gradient(circle at 34% 12%, rgba(255, 232, 175, 0.85) 0 1.2px, transparent 2.4px),
		radial-gradient(circle at 47% 88%, rgba(255, 232, 175, 0.9) 0 1.6px, transparent 2.8px),
		radial-gradient(circle at 58% 20%, rgba(255, 232, 175, 0.8) 0 1.2px, transparent 2.4px),
		radial-gradient(circle at 71% 82%, rgba(255, 232, 175, 0.9) 0 1.5px, transparent 2.7px),
		radial-gradient(circle at 83% 16%, rgba(255, 232, 175, 0.95) 0 1.7px, transparent 3px),
		radial-gradient(circle at 92% 70%, rgba(255, 232, 175, 0.85) 0 1.3px, transparent 2.5px),
		radial-gradient(circle at 4% 52%, rgba(255, 232, 175, 0.8) 0 1.2px, transparent 2.4px),
		radial-gradient(circle at 64% 50%, rgba(255, 232, 175, 0.7) 0 1.1px, transparent 2.3px);
}

.mhrf-diwali__lines {
	font-size: clamp(0.8rem, 1.2vw, 1rem);
	letter-spacing: var(--mhrf-diwali-track);
}

.mhrf-diwali__message {
	font-size: clamp(1.2rem, 2vw, 1.55rem);
}

.mhrf-diwali__greeting {
	font-size: clamp(1.7rem, 3.2vw, 3rem);
	background: none;
	-webkit-text-fill-color: currentColor;
	color: var(--mhrf-diwali-gold-light);
}

.mhrf-diwali__letters span {
	display: inline-block;
	color: var(--mhrf-diwali-gold-light);
}

@supports ((-webkit-background-clip: text) or (background-clip: text)) {
	.mhrf-diwali__letters span {
		background: linear-gradient(100deg, #d6ac55 0%, #e9c978 38%, #fff6dc 50%, #e9c978 62%, #d6ac55 100%) 100% 0 / 300% 100%;
		-webkit-background-clip: text;
		background-clip: text;
		-webkit-text-fill-color: transparent;
		color: transparent;
	}
}

@media (max-width: 991px) {
	.mhrf-diwali__inner {
		grid-template-columns: 190px minmax(0, 1fr);
		gap: 40px;
	}

	.mhrf-diwali__art {
		width: 190px;
	}

	.mhrf-diwali__mandala {
		width: 460px;
		height: 460px;
		margin: -230px 0 0 -230px;
	}
}

@media (max-width: 639px) {
	.mhrf-diwali {
		--mhrf-diwali-track: 0.24em;
	}

	.mhrf-diwali__inner {
		grid-template-columns: minmax(0, 1fr);
	}

	.mhrf-diwali__art {
		width: 170px;
	}

	.mhrf-diwali__mandala {
		width: 400px;
		height: 400px;
		margin: -200px 0 0 -200px;
	}

	.mhrf-diwali__greeting {
		font-size: clamp(1.4rem, 6.4vw, 2rem);
	}

	.mhrf-diwali__ring {
		width: 96px;
		height: 96px;
		margin: -48px 0 0 -48px;
	}
}

@media (prefers-reduced-motion: no-preference) {
	.mhrf-diwali.is-armed:not(.is-static) .mhrf-diwali__greeting {
		opacity: 1;
	}

	.mhrf-diwali.is-armed:not(.is-static) .mhrf-diwali__letters span {
		opacity: 0;
	}

	.mhrf-diwali.is-armed:not(.is-static)::after {
		opacity: 0;
	}

	.mhrf-diwali.is-playing .mhrf-diwali__greeting {
		animation: none;
	}

	.mhrf-diwali.is-playing .mhrf-diwali__letters span {
		animation:
			mhrf-diwali-letter-in 0.8s var(--mhrf-diwali-ease) calc(var(--mhrf-diwali-t) * 2.95s) both,
			mhrf-diwali-sweep 6s ease-in-out calc(var(--mhrf-diwali-t) * 5s + var(--i) * 85ms) infinite;
	}

	/* Headlines widen into place, in focus */
	.mhrf-diwali.is-playing .mhrf-diwali__line--1 {
		animation: mhrf-diwali-track calc(var(--mhrf-diwali-t) * 2s) var(--mhrf-diwali-ease) calc(var(--mhrf-diwali-t) * 2.2s) both;
	}

	.mhrf-diwali.is-playing .mhrf-diwali__line--2 {
		animation: mhrf-diwali-track calc(var(--mhrf-diwali-t) * 2s) var(--mhrf-diwali-ease) calc(var(--mhrf-diwali-t) * 2.45s) both;
	}

	/* The mandala fades up fuller, then turns very slowly */
	.mhrf-diwali.is-playing .mhrf-diwali__mandala {
		animation: mhrf-diwali-mandala-in calc(var(--mhrf-diwali-t) * 2.4s) var(--mhrf-diwali-ease) both, mhrf-diwali-spin 150s linear infinite;
	}

	/* Rays and glow breathe more clearly */
	.mhrf-diwali.is-playing .mhrf-diwali__rays::before {
		animation: mhrf-diwali-sway 18s ease-in-out infinite;
	}

	.mhrf-diwali.is-playing .mhrf-diwali__glow {
		animation: mhrf-diwali-glow calc(var(--mhrf-diwali-t) * 7s) var(--mhrf-diwali-ease) both, mhrf-diwali-lamp-deep 4.3s ease-in-out calc(var(--mhrf-diwali-t) * 7s) infinite;
	}

	/* A ripple of light leaves the diya the moment the flame catches */
	.mhrf-diwali.is-playing .mhrf-diwali__ring {
		animation: mhrf-diwali-ripple 1.2s ease-out calc(var(--mhrf-diwali-t) * 2.1s + 0.12s) both;
	}

	.mhrf-diwali.is-playing .mhrf-diwali__ring::after {
		content: "";
		position: absolute;
		inset: -2px;
		border: 2px solid rgba(255, 218, 160, 0.7);
		border-radius: 50%;
		opacity: 0;
		animation: mhrf-diwali-ripple 1.2s ease-out calc(var(--mhrf-diwali-t) * 2.1s + 0.35s) both;
	}

	/* Embers drift up off the flame once it is lit */
	.mhrf-diwali.is-playing .mhrf-diwali__ember {
		animation: mhrf-diwali-ember var(--d) ease-out calc(var(--mhrf-diwali-t) * 3.2s + var(--i) * 0.55s) infinite;
	}

	/* A livelier flame */
	.mhrf-diwali.is-playing .mhrf-diwali__flame-body {
		animation: mhrf-diwali-flame 2.2s ease-in-out calc(var(--mhrf-diwali-t) * 3.1s) infinite;
	}

	.mhrf-diwali.is-playing .mhrf-diwali__flame-core {
		animation: mhrf-diwali-flame 1.6s ease-in-out calc(var(--mhrf-diwali-t) * 3.1s) infinite reverse;
	}

	.mhrf-diwali.is-playing::after {
		animation: mhrf-diwali-twinkle 5s ease-in-out calc(var(--mhrf-diwali-t) * 2.4s) infinite backwards;
	}

	.mhrf-diwali.is-paused .mhrf-diwali__ember,
	.mhrf-diwali.is-paused::after,
	.mhrf-diwali.is-paused .mhrf-diwali__mandala,
	.mhrf-diwali.is-paused .mhrf-diwali__letters span {
		animation-play-state: paused;
	}
}

@keyframes mhrf-diwali-letter-in {
	from {
		opacity: 0;
		clip-path: inset(100% 0 -20% 0);
		transform: translate3d(0, 60%, 0);
	}

	to {
		opacity: 1;
		clip-path: inset(-20% -10% -20% -10%);
		transform: translate3d(0, 0, 0);
	}
}

@keyframes mhrf-diwali-sweep {
	0% {
		background-position: 100% 0;
	}

	22%,
	100% {
		background-position: 0 0;
	}
}

@keyframes mhrf-diwali-track {
	from {
		opacity: 0;
		clip-path: inset(-20% 100% -20% -10%);
		transform: translate3d(-12px, 0, 0);
	}

	to {
		opacity: 1;
		clip-path: inset(-20% -10% -20% -10%);
		transform: translate3d(0, 0, 0);
	}
}

@keyframes mhrf-diwali-mandala-in {
	from {
		opacity: 0;
		transform: scale(0.9);
	}

	to {
		opacity: 0.24;
		transform: scale(1);
	}
}

@keyframes mhrf-diwali-spin {
	to {
		rotate: 360deg;
	}
}

@keyframes mhrf-diwali-sway {
	0%,
	100% {
		transform: rotate(-3deg);
	}

	50% {
		transform: rotate(3deg);
	}
}

@keyframes mhrf-diwali-lamp-deep {
	0%,
	100% {
		opacity: 1;
	}

	20% {
		opacity: 0.8;
	}

	40% {
		opacity: 0.98;
	}

	62% {
		opacity: 0.76;
	}

	82% {
		opacity: 0.94;
	}
}

@keyframes mhrf-diwali-ripple {
	0% {
		opacity: 0.95;
		transform: scale(0.3);
	}

	100% {
		opacity: 0;
		transform: scale(5);
	}
}

@keyframes mhrf-diwali-ember {
	0% {
		opacity: 0;
		transform: translate3d(0, 0, 0) scale(1);
	}

	12% {
		opacity: 1;
	}

	100% {
		opacity: 0;
		transform: translate3d(var(--dx), -170px, 0) scale(0.3);
	}
}

@keyframes mhrf-diwali-flame {
	0%,
	100% {
		transform: scale(1, 1) skewX(0deg);
	}

	22% {
		transform: scale(0.94, 1.08) skewX(3deg);
	}

	48% {
		transform: scale(1.05, 0.93) skewX(-3deg);
	}

	74% {
		transform: scale(0.96, 1.06) skewX(2deg);
	}
}

@keyframes mhrf-diwali-twinkle {
	0%,
	100% {
		opacity: 0.25;
	}

	50% {
		opacity: 1;
	}
}

/* The hero dots sit centred; where the tab is wide enough to reach them, lift them above it */
@media (max-width: 767.98px) {
	#heroSlider .hero-slider-dots {
		bottom: calc(54px + 1rem);
	}
}

@media (max-width: 639px) {
	#heroSlider .hero-slider-dots {
		bottom: calc(42px + 1rem);
	}
}
