/**
 * Shared deity page styles (9-deity package layout).
 * Colors via --hb-deity-accent / --hb-deity-deep on .hb-deity-page.
 */

.hb-deity-page {
	--hb-deity-accent: #e56b12;
	--hb-deity-deep: #8b1e1e;
	--hb-deity-ink: #3c2417;
	--hb-deity-muted: #70594b;
	--hb-deity-line: #efd2a5;
	--hb-deity-shadow: 0 16px 42px rgba(91, 49, 13, 0.11);
	color: var(--hb-deity-ink);
	line-height: 1.7;
	background:
		radial-gradient(circle at 8% 2%, rgba(245, 158, 11, 0.12), transparent 23%),
		linear-gradient(#fffdf8, #fff7e8);
}

.hb-deity-page a { text-decoration: none; color: inherit; }
.hb-deity-page section { padding: 67px 0; }

.hb-deity-grid { display: grid; gap: 20px; }
.hb-deity-card {
	background: rgba(255, 255, 255, 0.92);
	border: 1px solid var(--hb-deity-line);
	border-radius: 20px;
	box-shadow: var(--hb-deity-shadow);
}

.hb-deity-section-title { text-align: center; margin-bottom: 33px; }
.hb-deity-section-title > span {
	color: var(--hb-deity-accent);
	font-weight: 800;
}
.hb-deity-section-title h2 {
	font-size: clamp(29px, 4vw, 42px);
	color: var(--hb-deity-deep);
	line-height: 1.25;
	margin: 5px 0 8px;
}
.hb-deity-section-title h2::after { display: none; }
.hb-deity-section-title p {
	max-width: 760px;
	margin: auto;
	color: var(--hb-deity-muted);
}

/* Hero */
.hb-deity-hero {
	position: relative;
	overflow: hidden;
	background: linear-gradient(115deg, rgba(255, 250, 240, 0.99), rgba(255, 250, 240, 0.9) 58%, rgba(245, 158, 11, 0.16));
	border-bottom: 1px solid var(--hb-deity-line);
	padding: 0;
}
.hb-deity-hero::before {
	content: "";
	position: absolute;
	width: 430px;
	height: 430px;
	border-radius: 50%;
	right: 5%;
	top: 35px;
	background: repeating-radial-gradient(circle, rgba(229, 107, 18, 0.24) 0 2px, transparent 2px 16px);
}
.hb-deity-hero-icon {
	position: absolute;
	right: 13%;
	top: 120px;
	font-size: 170px;
	filter: drop-shadow(0 18px 25px rgba(0, 0, 0, 0.13));
	line-height: 1;
}
.hb-deity-hero-inner {
	min-height: 490px;
	display: flex;
	align-items: center;
	padding: 68px 0;
}
.hb-deity-hero-copy { max-width: 670px; position: relative; z-index: 2; }
.hb-deity-tag {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	background: #fff2d9;
	border: 1px solid #efca8d;
	color: var(--hb-deity-accent);
	font-weight: 800;
	border-radius: 999px;
	padding: 7px 14px;
}
.hb-deity-hero h1 {
	font-size: clamp(50px, 7vw, 86px);
	line-height: 1.06;
	color: var(--hb-deity-deep);
	margin: 14px 0 4px;
}
.hb-deity-hero h2 {
	font-size: clamp(23px, 3vw, 37px);
	margin: 0 0 17px;
	color: var(--hb-deity-ink);
}
.hb-deity-hero p { font-size: 18px; }
.hb-deity-hero-mantra {
	margin-top: 22px;
	padding: 15px 18px;
	background: rgba(255, 255, 255, 0.82);
	border-left: 4px solid var(--hb-deity-accent);
	border-radius: 0 12px 12px 0;
	color: var(--hb-deity-deep);
	font-size: 20px;
	font-weight: 800;
	max-width: 580px;
}
.hb-deity-actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 23px; }
.hb-deity-btn {
	padding: 13px 21px;
	border-radius: 11px;
	font-weight: 800;
	transition: 0.2s;
	display: inline-flex;
	align-items: center;
}
.hb-deity-btn:hover { transform: translateY(-2px); }
.hb-deity-btn-primary {
	color: #fff;
	background: linear-gradient(135deg, var(--hb-deity-deep), var(--hb-deity-accent));
	box-shadow: 0 12px 25px rgba(139, 30, 30, 0.2);
}
.hb-deity-btn-light {
	background: #fff;
	border: 1px solid var(--hb-deity-line);
	color: var(--hb-deity-deep);
}

/* Facts */
.hb-deity-facts-wrap { position: relative; z-index: 4; margin-top: -42px; }
.hb-deity-facts {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	background: #fff;
	border: 1px solid var(--hb-deity-line);
	border-radius: 18px;
	overflow: hidden;
	box-shadow: var(--hb-deity-shadow);
}
.hb-deity-fact {
	text-align: center;
	padding: 20px 12px;
	border-right: 1px solid #f2dfbf;
}
.hb-deity-fact:last-child { border-right: 0; }
.hb-deity-fact span { font-size: 27px; }
.hb-deity-fact strong { display: block; color: var(--hb-deity-deep); }
.hb-deity-fact small { color: var(--hb-deity-muted); }

/* Intro */
.hb-deity-intro { grid-template-columns: 1.1fr 0.9fr; }
.hb-deity-intro-copy { padding: 30px; }
.hb-deity-intro-copy h3 {
	font-size: 28px;
	color: var(--hb-deity-deep);
	margin: 0 0 12px;
}
.hb-deity-intro-copy p { color: var(--hb-deity-muted); }
.hb-deity-emblem {
	min-height: 350px;
	display: grid;
	place-items: center;
	text-align: center;
	background:
		radial-gradient(circle, #fff7c9 0 20%, transparent 21% 34%, rgba(229, 107, 18, 0.12) 35% 49%, transparent 50%),
		linear-gradient(145deg, #fff1ce, #fff);
}
.hb-deity-emblem-circle {
	width: 205px;
	height: 205px;
	border-radius: 50%;
	display: grid;
	place-items: center;
	font-size: 90px;
	background: radial-gradient(circle, #fff8d2, #f7c54d, var(--hb-deity-accent));
	box-shadow: 0 0 50px rgba(229, 107, 18, 0.35);
	border: 12px solid rgba(255, 255, 255, 0.55);
	margin: 0 auto;
}
.hb-deity-emblem h3 {
	color: var(--hb-deity-deep);
	font-size: 25px;
	margin: 12px 0 0;
}
.hb-deity-emblem p {
	color: var(--hb-deity-muted);
	margin-top: 5px;
}

/* Names / info grids */
.hb-deity-names { grid-template-columns: repeat(4, 1fr); }
.hb-deity-name-card { text-align: center; padding: 22px; }
.hb-deity-round {
	width: 56px;
	height: 56px;
	border-radius: 50%;
	display: grid;
	place-items: center;
	margin: 0 auto 11px;
	background: #fff1d5;
	border: 1px solid #efc477;
	color: var(--hb-deity-accent);
	font-size: 25px;
}
.hb-deity-name-card h3,
.hb-deity-info-card h3,
.hb-deity-temple-body h3 {
	color: var(--hb-deity-deep);
	margin: 0 0 6px;
}
.hb-deity-name-card p,
.hb-deity-info-card p,
.hb-deity-temple-body p {
	color: var(--hb-deity-muted);
	margin: 0;
}
.hb-deity-four { grid-template-columns: repeat(4, 1fr); }
.hb-deity-three { grid-template-columns: repeat(3, 1fr); }
.hb-deity-info-card { padding: 24px; }
.hb-deity-info-card .hb-deity-big { font-size: 35px; }

.hb-deity-tint {
	background: linear-gradient(#fff8e9, #fff0d8);
	border-top: 1px solid var(--hb-deity-line);
	border-bottom: 1px solid var(--hb-deity-line);
}

.hb-deity-mantras { grid-template-columns: repeat(2, 1fr); }
.hb-deity-mantra-card { padding: 26px; }
.hb-deity-mantra-card h3 {
	color: var(--hb-deity-deep);
	margin: 0 0 10px;
}
.hb-deity-mantra-text {
	padding: 14px 16px;
	background: #fff8e8;
	border-left: 4px solid var(--hb-deity-accent);
	border-radius: 0 11px 11px 0;
	color: var(--hb-deity-deep);
	font-size: 19px;
	font-weight: 800;
}
.hb-deity-mantra-card p {
	color: var(--hb-deity-muted);
	margin-bottom: 0;
}

/* Puja */
.hb-deity-puja {
	grid-template-columns: 0.9fr 1.1fr;
	align-items: start;
}
.hb-deity-puja-art {
	min-height: 500px;
	position: sticky;
	top: 100px;
	display: grid;
	place-items: center;
	text-align: center;
	color: #fff;
	background: radial-gradient(circle at 50% 32%, #fff7c7, #f1ad48 38%, var(--hb-deity-deep));
	overflow: hidden;
}
.hb-deity-puja-art .hb-deity-large { font-size: 130px; line-height: 1; }
.hb-deity-puja-art h3 { font-size: 29px; margin: 10px 0 3px; color: #fff; }
.hb-deity-puja-art p { color: rgba(255, 255, 255, 0.92); }
.hb-deity-steps { display: grid; gap: 13px; }
.hb-deity-step { display: flex; gap: 15px; padding: 18px; }
.hb-deity-step-no {
	flex: 0 0 46px;
	width: 46px;
	height: 46px;
	border-radius: 50%;
	display: grid;
	place-items: center;
	background: linear-gradient(135deg, var(--hb-deity-accent), var(--hb-deity-deep));
	color: #fff;
	font-weight: 900;
}
.hb-deity-step h3 { color: var(--hb-deity-deep); margin: 0 0 3px; }
.hb-deity-step p { color: var(--hb-deity-muted); margin: 0; }
.hb-deity-note {
	margin-top: 18px;
	padding: 17px 19px;
	background: #fff4dc;
	border: 1px solid #efc87f;
	border-radius: 13px;
	color: #67431f;
}

/* Temples */
.hb-deity-temples { grid-template-columns: repeat(3, 1fr); }
.hb-deity-temple { overflow: hidden; }
.hb-deity-temple-art {
	height: 180px;
	display: grid;
	place-items: center;
	font-size: 76px;
	background: radial-gradient(circle, #fff7cd, #eeb24f, var(--hb-deity-deep));
}
.hb-deity-temple-body { padding: 21px; }

/* Quote */
.hb-deity-quote {
	color: #fff;
	text-align: center;
	padding: 33px;
	border-radius: 20px;
	background:
		radial-gradient(circle at 10% 50%, rgba(255, 193, 7, 0.28), transparent 27%),
		linear-gradient(135deg, var(--hb-deity-deep), var(--hb-deity-accent), var(--hb-deity-deep));
	box-shadow: 0 18px 44px rgba(80, 20, 10, 0.22);
}
.hb-deity-quote h2 { margin: 0 0 10px; color: #fff; }
.hb-deity-quote h2::after { display: none; }
.hb-deity-quote blockquote {
	font-size: 22px;
	font-weight: 800;
	max-width: 900px;
	margin: 10px auto;
}
.hb-deity-quote p {
	max-width: 850px;
	margin: 8px auto 0;
	color: #ffe5d8;
}

/* FAQ / related */
.hb-deity-faq { max-width: 900px; margin: auto; }
.hb-deity-faq details {
	background: #fff;
	border: 1px solid var(--hb-deity-line);
	border-radius: 12px;
	padding: 0 17px;
	margin-bottom: 11px;
}
.hb-deity-faq summary {
	padding: 15px 0;
	cursor: pointer;
	font-weight: 800;
	color: var(--hb-deity-deep);
}
.hb-deity-faq details p {
	color: var(--hb-deity-muted);
	margin: 0;
	padding: 0 0 16px;
}

.hb-deity-related { grid-template-columns: repeat(4, 1fr); }
.hb-deity-related-card {
	display: flex;
	align-items: center;
	gap: 13px;
	padding: 18px;
	transition: 0.2s;
}
.hb-deity-related-card:hover {
	transform: translateY(-3px);
	border-color: var(--hb-deity-accent);
}
.hb-deity-related-card > span { font-size: 27px; }
.hb-deity-related-card strong { display: block; color: var(--hb-deity-deep); }
.hb-deity-related-card small { color: var(--hb-deity-muted); }

@media (max-width: 1000px) {
	.hb-deity-hero-icon { opacity: 0.18; right: 4%; }
	.hb-deity-facts { grid-template-columns: repeat(3, 1fr); }
	.hb-deity-names { grid-template-columns: repeat(2, 1fr); }
	.hb-deity-four,
	.hb-deity-related { grid-template-columns: repeat(2, 1fr); }
	.hb-deity-three,
	.hb-deity-temples { grid-template-columns: repeat(2, 1fr); }
	.hb-deity-intro,
	.hb-deity-puja { grid-template-columns: 1fr; }
	.hb-deity-puja-art { position: relative; top: auto; min-height: 370px; }
}

@media (max-width: 650px) {
	.hb-deity-page section { padding: 52px 0; }
	.hb-deity-hero-inner { min-height: 550px; padding: 54px 0; }
	.hb-deity-hero h1 { font-size: 52px; }
	.hb-deity-hero-icon { font-size: 120px; top: 180px; }
	.hb-deity-facts-wrap { margin-top: -23px; }
	.hb-deity-facts { grid-template-columns: 1fr 1fr; }
	.hb-deity-fact:nth-child(even) { border-right: 0; }
	.hb-deity-fact:last-child { grid-column: 1 / -1; }
	.hb-deity-intro,
	.hb-deity-names,
	.hb-deity-four,
	.hb-deity-three,
	.hb-deity-mantras,
	.hb-deity-temples,
	.hb-deity-related { grid-template-columns: 1fr; }
	.hb-deity-emblem-circle { width: 170px; height: 170px; font-size: 72px; }
	.hb-deity-quote { padding: 25px 18px; }
	.hb-deity-quote blockquote { font-size: 19px; }
}
