/* ============================================================
 * Tfilah English — Main Stylesheet
 * Version: 0.2.0
 * ============================================================ */

:root {
	--gold: #9b7d3a;
	--gold-light: #b89854;
	--gold-pale: #e8d9b8;
	--brown: #6b4f2a;
	--brown-dark: #3d2d18;
	--cream: #f5f0e8;
	--cream-dark: #ebe4d6;
	--parchment: #faf6ee;
	--white: #ffffff;
	--line: #d9cdb6;
	--line-soft: #ebe4d6;

	--font-display: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
	--font-body: 'Crimson Pro', Georgia, serif;

	--container-w: 1200px;
}

/* === Reset & base === */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
	margin: 0;
	font-family: var(--font-body);
	font-size: 17px;
	line-height: 1.6;
	color: var(--brown-dark);
	background: var(--cream);
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--gold); text-decoration: none; }
a:hover { color: var(--brown); }
button { font-family: inherit; cursor: pointer; }

.container { max-width: var(--container-w); margin: 0 auto; padding: 0 24px; }

/* === Header === */
.site-header {
	background: var(--parchment);
	border-bottom: 1px solid var(--line);
	padding: 14px 0;
	position: sticky;
	top: 0;
	z-index: 50;
}
.header-inner { display: flex; align-items: center; justify-content: space-between; }
.brand { display: flex; align-items: baseline; gap: 14px; text-decoration: none; }
.brand-name {
	font-family: var(--font-display);
	font-size: 32px;
	font-weight: 600;
	color: var(--brown-dark);
	letter-spacing: 0.5px;
}
.brand-tagline {
	font-family: var(--font-display);
	font-size: 13px;
	font-style: italic;
	color: var(--gold);
	letter-spacing: 1px;
}
.primary-nav { display: flex; align-items: center; gap: 28px; }
.nav-list { list-style: none; display: flex; gap: 28px; margin: 0; padding: 0; }
.nav-list a { color: var(--brown); font-size: 15px; padding-bottom: 2px; border-bottom: 2px solid transparent; transition: border-color .15s; }
.nav-list a:hover { border-bottom-color: var(--gold); }
.lang-switch { font-style: italic; }

@media (max-width: 720px) {
	.brand-tagline { display: none; }
	.primary-nav { gap: 14px; }
	.nav-list { gap: 14px; font-size: 14px; }
}

/* === Hero (no Hebrew watermark in V2) === */
.hero {
	background: linear-gradient(180deg, var(--parchment) 0%, var(--cream) 100%);
	padding: 80px 24px 70px;
}
.hero-inner { max-width: 900px; margin: 0 auto; text-align: center; }
.hero-eyebrow {
	font-family: var(--font-display);
	font-style: italic;
	font-size: 16px;
	color: var(--gold);
	letter-spacing: 3px;
	text-transform: uppercase;
	margin-bottom: 24px;
}
.hero-title {
	font-family: var(--font-display);
	font-size: 64px;
	font-weight: 500;
	color: var(--brown-dark);
	margin: 0 0 12px;
	line-height: 1.05;
	letter-spacing: -1px;
}
.hero-title em { color: var(--gold); font-style: italic; }
.hero-blurb {
	font-size: 19px;
	color: var(--brown);
	line-height: 1.6;
	max-width: 640px;
	margin: 36px auto;
}
.hero-actions { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }

@media (max-width: 720px) {
	.hero-title { font-size: 38px; }
}

/* === Buttons === */
.btn {
	display: inline-block;
	padding: 14px 30px;
	font-family: var(--font-body);
	font-size: 16px;
	letter-spacing: 0.5px;
	border: 1px solid transparent;
	cursor: pointer;
	transition: all .15s;
	text-decoration: none;
}
.btn-primary { background: var(--gold); color: var(--white); }
.btn-primary:hover { background: var(--brown); color: var(--white); }
.btn-secondary { background: transparent; color: var(--brown); border-color: var(--brown); }
.btn-secondary:hover { background: var(--brown); color: var(--white); }
.btn-outline-light { background: transparent; color: var(--white); border-color: var(--gold-light); }
.btn-outline-light:hover { background: var(--gold-light); }

.btn-icon {
	background: var(--white);
	border: 1px solid var(--line);
	padding: 8px 14px;
	font-family: var(--font-body);
	font-size: 14px;
	color: var(--brown);
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	gap: 6px;
}
.btn-icon:hover { background: var(--parchment); }

/* === Sections === */
.section { padding: 70px 0; }
.section-categories { background: var(--cream); }
.section-welcome { background: var(--brown-dark); color: var(--cream); padding: 70px 0; }

.section-title {
	font-family: var(--font-display);
	font-size: 36px;
	font-weight: 500;
	color: var(--brown-dark);
	margin: 0 0 8px;
	text-align: center;
}
.section-subtitle { text-align: center; color: var(--brown); max-width: 600px; margin: 0 auto 40px; font-size: 17px; }

/* === Categories === */
.categories-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.category-card {
	display: block;
	background: var(--parchment);
	padding: 24px;
	border: 1px solid var(--line);
	text-decoration: none;
	color: inherit;
	transition: all .2s;
}
.category-card:hover { border-color: var(--gold); transform: translateY(-2px); }
.cat-label { font-family: var(--font-display); font-size: 22px; font-weight: 600; color: var(--brown-dark); margin-bottom: 6px; }
.cat-count { font-size: 13px; color: var(--brown); font-style: italic; }

@media (max-width: 900px) { .categories-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .categories-grid { grid-template-columns: 1fr; } }

/* === Welcome (dark band) === */
.welcome-inner { max-width: 800px; margin: 0 auto; text-align: center; }
.section-welcome h2 {
	font-family: var(--font-display);
	font-size: 38px;
	font-weight: 500;
	color: var(--white);
	margin: 0 0 18px;
	line-height: 1.2;
}
.section-welcome p {
	font-size: 18px;
	line-height: 1.7;
	color: var(--gold-pale);
	margin-bottom: 28px;
}

/* === Footer === */
.site-footer { background: var(--brown-dark); color: var(--cream); padding: 50px 0 24px; margin-top: 80px; }
.footer-cols { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 50px; padding-bottom: 32px; border-bottom: 1px solid var(--brown); }
.footer-name { font-family: var(--font-display); font-size: 28px; font-weight: 600; margin-bottom: 8px; }
.footer-tagline { font-family: var(--font-display); font-style: italic; font-size: 14px; color: var(--gold-light); margin-bottom: 18px; letter-spacing: 0.5px; }
.footer-blurb { font-size: 14px; line-height: 1.7; color: var(--gold-pale); max-width: 360px; margin: 0; }
.footer-heading { font-family: var(--font-display); font-size: 14px; color: var(--gold-light); text-transform: uppercase; letter-spacing: 1.5px; margin-bottom: 14px; }
.footer-col ul { list-style: none; padding: 0; margin: 0; }
.footer-col li { font-size: 14px; line-height: 2; }
.footer-col a { color: var(--cream); }
.footer-col a:hover { color: var(--gold-light); }
.footer-bottom { padding-top: 24px; font-size: 13px; color: var(--gold-pale); text-align: center; }
.footer-bottom a { color: var(--gold-light); }

@media (max-width: 900px) { .footer-cols { grid-template-columns: 1fr 1fr; gap: 30px; } }
@media (max-width: 600px) { .footer-cols { grid-template-columns: 1fr; } }

/* ============================================================
 * Prayer page V2 — 2 modes (Translation/Phonetic), Intro top, Q&A bottom
 * ============================================================ */

.prayer-head { background: var(--parchment); padding: 40px 0 30px; border-bottom: 1px solid var(--line); }
.prayer-head .container { max-width: 760px; }
.breadcrumb { font-size: 14px; color: var(--gold); margin-bottom: 18px; }
.breadcrumb a { color: var(--gold); }
.breadcrumb span { color: var(--brown); }
.prayer-title {
	font-family: var(--font-display);
	font-size: 56px;
	font-weight: 500;
	color: var(--brown-dark);
	margin: 0 0 4px;
	line-height: 1.05;
}
.prayer-title-phonetic {
	font-family: var(--font-display);
	font-style: italic;
	font-size: 22px;
	color: var(--gold);
}
.prayer-actions { display: flex; gap: 8px; margin-top: 24px; }

/* Intro — gold left border, prominent at top */
.prayer-intro { padding: 40px 0 0; }
.prayer-intro .container { max-width: 760px; }
.intro-card {
	background: var(--white);
	border: 1px solid var(--line);
	border-left: 4px solid var(--gold);
	padding: 28px 32px;
}
.intro-eyebrow {
	display: flex;
	align-items: center;
	gap: 8px;
	font-family: var(--font-display);
	font-size: 13px;
	color: var(--gold);
	letter-spacing: 2px;
	text-transform: uppercase;
	margin-bottom: 12px;
}
.intro-icon {
	display: inline-block;
	width: 22px; height: 22px;
	border: 1.5px solid var(--gold);
	border-radius: 50%;
	text-align: center;
	font-style: italic;
	font-family: serif;
	font-size: 14px;
	line-height: 19px;
	color: var(--gold);
}
.intro-card p {
	font-size: 17px;
	line-height: 1.7;
	color: var(--brown-dark);
	margin: 0;
}
.intro-card em { font-style: italic; color: var(--brown); }

/* Toolbar */
.prayer-toolbar { padding: 36px 0 0; }
.prayer-toolbar .container { max-width: 760px; }
.prayer-toolbar-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1px solid var(--line);
	padding-bottom: 14px;
	gap: 16px;
	flex-wrap: wrap;
}
.view-mode-switch { display: inline-flex; border: 1px solid var(--line); background: var(--parchment); }
.vm-btn {
	background: transparent;
	color: var(--brown);
	border: none;
	padding: 10px 28px;
	font-family: var(--font-body);
	font-size: 14px;
	letter-spacing: 0.5px;
	border-right: 1px solid var(--line);
	transition: background .15s;
}
.vm-btn:last-child { border-right: none; }
.vm-btn:hover { background: var(--white); }
.vm-btn.is-active { background: var(--gold); color: var(--white); }
.vm-btn.is-active:hover { background: var(--gold); }
.prayer-toolbar-hint { font-family: var(--font-display); font-style: italic; font-size: 14px; color: var(--gold); }

/* Prayer body */
.prayer-body { padding: 40px 0 50px; }
.prayer-body .container { max-width: 760px; }

/* Prayer text — verse spacing (p = one verse/sentence, not a thematic paragraph) */
.prayer-text .verse { margin: 0 0 8px; }
.translation-text p,
.phonetic-text p {
	margin: 0 0 8px;
	font-size: 22px;
	font-family: var(--font-body);
	line-height: 1.85;
}

/* Section headings inside prayer text */
.translation-text h2,
.phonetic-text h2 {
	font-family: var(--font-display);
	font-size: 32px;
	font-weight: 600;
	color: var(--brown-dark);
	margin: 2em 0 0.8em;
	line-height: 1.2;
	border-bottom: 1px solid var(--line);
	padding-bottom: 6px;
}
.translation-text h3,
.phonetic-text h3 {
	font-family: var(--font-display);
	font-size: 28px;
	font-weight: 600;
	color: var(--brown-dark);
	margin: 1.8em 0 0.7em;
	line-height: 1.2;
}
.translation-text h4,
.phonetic-text h4 {
	font-family: var(--font-display);
	font-size: 24px;
	font-weight: 600;
	color: var(--brown);
	margin: 1.6em 0 0.6em;
	line-height: 1.2;
}

.translation-text {
	font-family: var(--font-body);
	font-size: 22px;
	color: var(--brown-dark);
	line-height: 1.8;
}
.phonetic-text {
	font-family: var(--font-display);
	font-style: italic;
	font-size: 24px;
	color: var(--brown-dark);
	line-height: 1.7;
}

/* CTA */
.prayer-cta {
	background: var(--parchment);
	border-top: 1px solid var(--line);
	border-bottom: 1px solid var(--line);
	padding: 40px 0;
}
.prayer-cta .container { max-width: 700px; text-align: center; }
.prayer-cta h3 {
	font-family: var(--font-display);
	font-size: 26px;
	font-weight: 500;
	color: var(--brown-dark);
	margin: 0 0 14px;
}
.prayer-cta p { font-size: 16px; color: var(--brown); margin-bottom: 20px; line-height: 1.5; }
.prayer-cta-form { display: flex; justify-content: center; gap: 8px; flex-wrap: wrap; }
.prayer-cta-form input[type="email"] {
	padding: 12px 16px;
	font-family: var(--font-body);
	font-size: 14px;
	border: 1px solid var(--line);
	background: var(--white);
	width: 280px;
	color: var(--brown);
}

/* Q&A accordion */
.prayer-qa { padding: 60px 0 30px; }
.prayer-qa .container { max-width: 760px; }
.qa-head {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 28px;
}
.qa-icon {
	display: inline-block;
	width: 22px; height: 22px;
	background: var(--gold);
	color: var(--white);
	border-radius: 50%;
	text-align: center;
	font-weight: bold;
	font-size: 14px;
	line-height: 22px;
}
.prayer-qa h2 {
	font-family: var(--font-display);
	font-size: 32px;
	font-weight: 500;
	color: var(--brown-dark);
	margin: 0;
}

.qa-list { border-top: 1px solid var(--line); }
.qa-item { border-bottom: 1px solid var(--line); }
.qa-question {
	width: 100%;
	background: transparent;
	border: none;
	padding: 20px 0;
	cursor: pointer;
	text-align: left;
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-family: var(--font-display);
	font-size: 21px;
	font-weight: 500;
	color: var(--brown-dark);
}
.qa-question:hover { color: var(--gold); }
.qa-toggle {
	font-size: 28px;
	color: var(--gold);
	transition: transform .2s;
	line-height: 1;
}
.qa-question[aria-expanded="true"] .qa-toggle { transform: rotate(90deg); }
.qa-answer { padding-bottom: 24px; padding-right: 36px; }
.qa-answer p {
	font-family: var(--font-body);
	font-size: 17px;
	line-height: 1.7;
	color: var(--brown);
	margin: 0;
}

/* Prayer extra (regular post content if any) */
.prayer-extra { padding: 30px 0; }
.prayer-extra .container { max-width: 720px; }

/* === Generic page === */
.page { padding: 50px 0; }
.page-title { font-family: var(--font-display); font-size: 44px; font-weight: 500; color: var(--brown-dark); margin: 0 0 24px; }
.page-content { max-width: 720px; line-height: 1.7; }

/* === Archive === */
.archive { padding: 50px 0; }
.archive-title { font-family: var(--font-display); font-size: 44px; font-weight: 500; color: var(--brown-dark); margin: 0 0 24px; }
.archive-list { display: grid; gap: 14px; }
.archive-item { background: var(--white); padding: 24px; border: 1px solid var(--line); }
.archive-item h2 { font-family: var(--font-display); font-size: 24px; margin: 0 0 8px; }
.archive-item h2 a { color: var(--brown-dark); }

/* === 404 === */
.error-404 { padding: 100px 0; text-align: center; min-height: 60vh; display: flex; align-items: center; }
.error-content { max-width: 540px; margin: 0 auto; }
.error-code { font-family: var(--font-display); font-size: 120px; line-height: 1; color: var(--gold-pale); margin-bottom: 18px; }
.error-404 h1 { font-family: var(--font-display); font-size: 38px; font-weight: 500; color: var(--brown-dark); margin: 0 0 14px; }
.error-404 p { font-size: 18px; color: var(--brown); margin-bottom: 28px; }

@media (max-width: 720px) {
	.prayer-title { font-size: 36px; }
	.translation-text { font-size: 19px; }
	.phonetic-text { font-size: 21px; }
	.prayer-toolbar-inner { flex-direction: column; align-items: flex-start; }
}

/* ═══════════════════════════════════════════════════════════
   v0.3.1 — Homepage, Categories, Articles
   ═══════════════════════════════════════════════════════════ */

/* ─── Header brand logo (updated v0.3.1) ──────────────── */
.brand-logo {
	font-family: var(--font-display);
	font-size: 30px;
	font-weight: 600;
	color: var(--brown-dark);
	letter-spacing: .5px;
	line-height: 1;
}
.brand-logo em {
	color: var(--gold);
	font-style: italic;
	font-weight: 500;
}

.nav-list .nav-cta a,
.nav-list li.nav-cta > a {
	background: var(--gold);
	color: var(--white);
	padding: 7px 16px;
	border-radius: 4px;
	border-bottom: none !important;
}
.nav-list .nav-cta a:hover { background: var(--brown); }

/* ─── Icon helper ──────────────────────────────────────── */
.tf-icon {
	display: inline-block;
	vertical-align: middle;
}

/* ─── HOMEPAGE: Hero ───────────────────────────────────── */
.hp-hero {
	background:
		radial-gradient(ellipse 80% 60% at 50% 30%, rgba(184,152,84,.08), transparent),
		linear-gradient(180deg, var(--parchment) 0%, var(--cream) 100%);
	padding: 110px 32px 90px;
	text-align: center;
	position: relative;
	overflow: hidden;
}
.hp-hero::before {
	content: "";
	position: absolute;
	top: 0; left: 0; right: 0; bottom: 0;
	background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='600' height='600'><defs><pattern id='p' x='0' y='0' width='40' height='40' patternUnits='userSpaceOnUse'><circle cx='20' cy='20' r='1' fill='%239b7d3a' opacity='.06'/></pattern></defs><rect width='100%25' height='100%25' fill='url(%23p)'/></svg>");
	pointer-events: none;
}
.hp-hero-inner { max-width: 880px; margin: 0 auto; position: relative; }
.hp-hero-eyebrow {
	font-style: italic;
	color: var(--gold);
	font-size: 16px;
	letter-spacing: 4px;
	text-transform: uppercase;
	margin-bottom: 24px;
	opacity: 0;
	animation: hp-fadeUp .9s .1s both;
}
.hp-hero-title {
	font-family: var(--font-display);
	font-size: clamp(42px, 7vw, 80px);
	font-weight: 500;
	color: var(--brown-dark);
	line-height: 1.05;
	letter-spacing: -.5px;
	margin: 0 0 28px;
	opacity: 0;
	animation: hp-fadeUp .9s .25s both;
}
.hp-hero-title em { color: var(--gold); font-style: italic; font-weight: 400; }
.hp-hero-subtitle {
	font-size: clamp(17px, 2vw, 21px);
	color: var(--brown);
	line-height: 1.55;
	max-width: 640px;
	margin: 0 auto 40px;
	font-style: italic;
	opacity: 0;
	animation: hp-fadeUp .9s .4s both;
}
.hp-hero-actions {
	display: flex;
	gap: 14px;
	justify-content: center;
	flex-wrap: wrap;
	opacity: 0;
	animation: hp-fadeUp .9s .55s both;
}
@keyframes hp-fadeUp {
	from { opacity: 0; transform: translateY(20px); }
	to   { opacity: 1; transform: translateY(0); }
}

/* ─── HOMEPAGE: Section heads ──────────────────────────── */
.hp-section-inner { max-width: 1180px; margin: 0 auto; padding: 0 32px; }
.hp-section-head { text-align: center; margin-bottom: 56px; }
.hp-section-eyebrow {
	font-style: italic;
	color: var(--gold);
	font-size: 13px;
	letter-spacing: 3px;
	text-transform: uppercase;
	margin-bottom: 12px;
	display: block;
}
.hp-section-title {
	font-family: var(--font-display);
	font-size: clamp(34px, 5vw, 50px);
	font-weight: 500;
	color: var(--brown-dark);
	letter-spacing: -.3px;
	margin: 0;
}
.hp-section-title em { color: var(--gold); font-style: italic; font-weight: 400; }
.hp-section-subtitle {
	margin: 16px auto 0;
	font-size: 17px;
	color: var(--brown);
	font-style: italic;
	max-width: 600px;
}

/* ─── HOMEPAGE: Categories ─────────────────────────────── */
.hp-categories { padding: 90px 0; background: var(--cream); }
.hp-cat-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 22px;
}
.hp-cat-card {
	background: var(--white);
	border: 1px solid var(--cream-dark);
	border-radius: 4px;
	padding: 32px 28px;
	transition: all .3s;
	position: relative;
	overflow: hidden;
	display: block;
	color: var(--brown-dark);
}
.hp-cat-card::before {
	content: "";
	position: absolute;
	inset: 0 auto auto 0;
	width: 3px;
	height: 0;
	background: var(--gold);
	transition: height .3s;
}
.hp-cat-card:hover {
	transform: translateY(-3px);
	box-shadow: 0 14px 40px -20px rgba(61,45,24,.18);
	border-color: var(--gold-pale);
	color: var(--brown-dark);
}
.hp-cat-card:hover::before { height: 100%; }
.hp-cat-icon {
	display: block;
	color: var(--gold);
	margin-bottom: 16px;
}
.hp-cat-icon .tf-icon {
	width: 36px;
	height: 36px;
}
.hp-cat-name {
	font-family: var(--font-display);
	font-size: 24px;
	font-weight: 600;
	color: var(--brown-dark);
	margin: 0 0 10px;
	letter-spacing: -.3px;
}
.hp-cat-desc {
	font-size: 15px;
	color: var(--brown);
	line-height: 1.55;
	margin: 0 0 18px;
}
.hp-cat-count {
	font-style: italic;
	font-size: 13px;
	color: var(--gold);
	letter-spacing: .5px;
}
.hp-cat-count::after {
	content: " →";
	transition: padding-left .25s;
	display: inline-block;
}
.hp-cat-card:hover .hp-cat-count::after { padding-left: 4px; }

/* ─── HOMEPAGE: Featured prayers ───────────────────────── */
.hp-featured {
	padding: 90px 0;
	background: var(--parchment);
	border-top: 1px solid var(--cream-dark);
	border-bottom: 1px solid var(--cream-dark);
}
.hp-featured-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
	gap: 28px;
}
.hp-prayer-card {
	background: var(--white);
	padding: 36px 32px;
	border-radius: 4px;
	border: 1px solid var(--cream-dark);
	display: flex;
	flex-direction: column;
	min-height: 240px;
	transition: all .25s;
	color: var(--brown-dark);
}
.hp-prayer-card:hover {
	transform: translateY(-2px);
	box-shadow: 0 18px 48px -24px rgba(61,45,24,.15);
	color: var(--brown-dark);
}
.hp-prayer-cat {
	font-style: italic;
	color: var(--gold);
	font-size: 12px;
	letter-spacing: 2px;
	text-transform: uppercase;
	margin-bottom: 14px;
}
.hp-prayer-title {
	font-family: var(--font-display);
	font-size: 24px;
	font-weight: 600;
	line-height: 1.2;
	color: var(--brown-dark);
	margin: 0 0 16px;
}
.hp-prayer-excerpt {
	font-size: 15px;
	color: var(--brown);
	flex-grow: 1;
	margin: 0 0 22px;
	line-height: 1.55;
}
.hp-prayer-link {
	color: var(--gold);
	font-size: 15px;
	font-style: italic;
	align-self: flex-start;
}
.hp-prayer-link::after {
	content: " →";
	transition: padding-left .25s;
	display: inline-block;
}
.hp-prayer-card:hover .hp-prayer-link::after { padding-left: 4px; }

/* ─── HOMEPAGE: Articles ───────────────────────────────── */
.hp-articles { padding: 90px 0; background: var(--cream); }
.hp-articles-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: 32px;
}
.hp-article-card {
	border-left: 2px solid var(--gold-pale);
	padding-left: 28px;
	transition: border-color .25s;
}
.hp-article-card:hover { border-color: var(--gold); }
.hp-article-date {
	font-style: italic;
	color: var(--gold);
	font-size: 13px;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	margin-bottom: 10px;
	display: block;
}
.hp-article-title {
	font-family: var(--font-display);
	font-size: 22px;
	font-weight: 600;
	line-height: 1.25;
	color: var(--brown-dark);
	margin: 0 0 12px;
}
.hp-article-title a { color: inherit; }
.hp-article-title a:hover { color: var(--gold); }
.hp-article-excerpt {
	font-size: 15px;
	color: var(--brown);
	line-height: 1.55;
	margin: 0;
}
.hp-article-readmore {
	display: inline-block;
	margin-top: 14px;
	font-style: italic;
	color: var(--gold);
	font-size: 14px;
}
.hp-article-readmore::after { content: " →"; }
.hp-articles-cta { text-align: center; margin-top: 56px; }
.hp-articles-coming-soon {
	text-align: center;
	padding: 40px 0;
	color: var(--brown);
	font-style: italic;
	font-size: 17px;
}

/* ─── HOMEPAGE: About callout ──────────────────────────── */
.hp-about {
	padding: 100px 32px;
	background: var(--brown-dark);
	color: var(--cream);
	text-align: center;
}
.hp-about-inner { max-width: 800px; margin: 0 auto; }
.hp-about-eyebrow {
	font-style: italic;
	color: var(--gold-light);
	font-size: 13px;
	letter-spacing: 3px;
	text-transform: uppercase;
	margin-bottom: 22px;
	display: block;
}
.hp-about-text {
	font-family: var(--font-display);
	font-size: clamp(22px, 3vw, 30px);
	line-height: 1.5;
	font-weight: 400;
	font-style: italic;
	color: var(--cream);
	margin: 0 0 12px;
}
.hp-about-citation {
	margin-top: 14px;
	font-size: 13px;
	color: var(--gold-pale);
	letter-spacing: 1px;
	text-transform: uppercase;
}
.hp-about-actions {
	margin-top: 44px;
	display: flex;
	gap: 12px;
	justify-content: center;
	flex-wrap: wrap;
}

/* ─── CATEGORY ARCHIVE ─────────────────────────────────── */
.cat-header {
	background: linear-gradient(180deg, var(--parchment) 0%, var(--cream) 100%);
	padding: 80px 32px 60px;
	text-align: center;
	border-bottom: 1px solid var(--cream-dark);
}
.cat-header-inner { max-width: 800px; margin: 0 auto; }
.cat-header-eyebrow {
	font-style: italic;
	color: var(--gold);
	font-size: 13px;
	letter-spacing: 3px;
	text-transform: uppercase;
	margin-bottom: 12px;
	display: block;
}
.cat-header-title {
	font-family: var(--font-display);
	font-size: clamp(36px, 5vw, 56px);
	font-weight: 500;
	color: var(--brown-dark);
	letter-spacing: -.3px;
	margin: 0;
}
.cat-header-desc {
	margin: 16px auto 0;
	font-size: 17px;
	color: var(--brown);
	font-style: italic;
}
.cat-body { padding: 70px 32px; background: var(--cream); }
.cat-body-inner { max-width: 1180px; margin: 0 auto; }

.cat-prayer-list {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
	gap: 22px;
}
.cat-prayer-card {
	background: var(--white);
	padding: 28px 26px;
	border: 1px solid var(--cream-dark);
	border-radius: 4px;
	transition: all .25s;
	color: var(--brown-dark);
	display: block;
}
.cat-prayer-card:hover {
	transform: translateY(-2px);
	box-shadow: 0 12px 32px -16px rgba(61,45,24,.15);
	border-color: var(--gold-pale);
	color: var(--brown-dark);
}
.cat-prayer-title {
	font-family: var(--font-display);
	font-size: 22px;
	font-weight: 600;
	line-height: 1.25;
	color: var(--brown-dark);
	margin: 0 0 12px;
}
.cat-prayer-excerpt {
	font-size: 14px;
	color: var(--brown);
	line-height: 1.55;
	margin: 0 0 16px;
}
.cat-prayer-link {
	color: var(--gold);
	font-size: 13px;
	font-style: italic;
}
.cat-prayer-link::after { content: " →"; }

/* ── Article archive — card grid ──
   Was a flat left-bordered list that read as undifferentiated rows. Cards
   give each question its own surface and make the grid scannable. */
.cat-article-list {
	max-width: 1080px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(330px, 1fr));
	gap: 26px;
	align-items: stretch;
}
.cat-article-card {
	position: relative;
	display: flex;
	flex-direction: column;
	background: var(--parchment);
	border: 1px solid var(--line);
	border-radius: 4px;
	padding: 30px 28px 26px;
	transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
/* Gold rule along the top edge, drawn on hover. */
.cat-article-card::before {
	content: "";
	position: absolute;
	top: -1px;
	left: -1px;
	right: -1px;
	height: 3px;
	background: var(--gold);
	border-radius: 4px 4px 0 0;
	opacity: 0;
	transform: scaleX(.35);
	transition: opacity .25s ease, transform .25s ease;
}
.cat-article-card:hover {
	transform: translateY(-3px);
	box-shadow: 0 12px 28px rgba(107, 79, 42, .11);
	border-color: var(--gold-pale);
}
.cat-article-card:hover::before { opacity: 1; transform: scaleX(1); }

/* The whole card is clickable; the title link is stretched over it. */
.cat-article-title a::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: 4px;
}

.cat-article-date {
	font-style: italic;
	color: var(--gold);
	font-size: 12px;
	letter-spacing: 1.4px;
	text-transform: uppercase;
	margin-bottom: 12px;
	display: block;
}
.cat-article-title {
	font-family: var(--font-display);
	font-size: 22px;
	font-weight: 600;
	line-height: 1.3;
	color: var(--brown-dark);
	margin: 0 0 14px;
	text-wrap: balance;
}
.cat-article-title a { color: inherit; }
.cat-article-card:hover .cat-article-title { color: var(--gold); }
.cat-article-excerpt {
	font-size: 15px;
	color: var(--brown);
	line-height: 1.65;
	margin: 0;
	flex: 1 1 auto;
}
.cat-article-excerpt p { margin: 0; }
.cat-article-readmore {
	display: inline-block;
	align-self: flex-start;
	margin-top: 20px;
	padding-top: 14px;
	border-top: 1px solid var(--line);
	width: 100%;
	font-style: italic;
	color: var(--gold);
	font-size: 14px;
}
.cat-article-readmore::after {
	content: " →";
	display: inline-block;
	transition: transform .25s ease;
}
.cat-article-card:hover .cat-article-readmore::after { transform: translateX(4px); }

@media (max-width: 760px) {
	.cat-article-list { grid-template-columns: 1fr; gap: 18px; }
	.cat-article-card { padding: 24px 22px 22px; }
	.cat-article-title { font-size: 20px; }
	/* No hover on touch — keep the gold rule permanently visible instead. */
	.cat-article-card::before { opacity: 1; transform: scaleX(1); }
	.cat-article-card:hover { transform: none; box-shadow: none; }
}
.cat-empty {
	text-align: center;
	color: var(--brown);
	font-style: italic;
	padding: 60px 0;
}
.cat-pagination {
	margin-top: 40px;
	text-align: center;
}

/* ─── SINGLE ARTICLE ───────────────────────────────────── */
.article-single-head {
	background: linear-gradient(180deg, var(--parchment) 0%, var(--cream) 100%);
	padding: 80px 32px 50px;
	text-align: center;
	border-bottom: 1px solid var(--cream-dark);
}
.article-single-head-inner { max-width: 760px; margin: 0 auto; }
.article-single-cat {
	font-style: italic;
	color: var(--gold);
	font-size: 12px;
	letter-spacing: 3px;
	text-transform: uppercase;
	margin-bottom: 14px;
	display: block;
}
.article-single-title {
	font-family: var(--font-display);
	font-size: clamp(32px, 5vw, 48px);
	font-weight: 500;
	color: var(--brown-dark);
	letter-spacing: -.3px;
	line-height: 1.2;
	margin: 0 0 20px;
}
.article-single-meta {
	font-size: 14px;
	color: var(--brown);
	font-style: italic;
}
.article-single-body { padding: 60px 32px 40px; background: var(--cream); }
.article-single-body-inner {
	max-width: 720px;
	margin: 0 auto;
	font-size: 18px;
	color: var(--brown-dark);
	line-height: 1.75;
}
.article-single-body-inner p { margin: 0 0 22px; }
.article-single-body-inner h2 {
	font-family: var(--font-display);
	font-size: 28px;
	color: var(--brown-dark);
	margin: 36px 0 16px;
	font-weight: 600;
}
.article-single-body-inner h3 {
	font-family: var(--font-display);
	font-size: 22px;
	color: var(--brown-dark);
	margin: 30px 0 14px;
	font-weight: 600;
}
.article-single-foot {
	padding: 30px 32px 80px;
	background: var(--cream);
	text-align: center;
}

/* ═══════════════════════════════════════════════════════════
   v0.3.2 — Mobile Featured + footer tweaks
   ═══════════════════════════════════════════════════════════ */

/* On mobile (< 720px), show only the first featured prayer card */
@media (max-width: 720px) {
	.hp-prayer-card-extra { display: none; }
	.hp-featured-grid { grid-template-columns: 1fr; }
}

/* Footer link with "coming soon" subtle marker */
.footer-link-soon span {
	font-size: 11px;
	color: var(--gold-pale);
	font-style: italic;
	letter-spacing: .5px;
	margin-left: 4px;
	opacity: .8;
}
.footer-link-soon { color: var(--brown); }
.footer-link-soon:hover { color: var(--gold); }

/* Footer brand "Tfilah" — white on dark footer background */
.footer-name {
	font-family: var(--font-display);
	font-size: 26px;
	font-weight: 600;
	color: rgba(255,255,255,.9);
	line-height: 1;
	margin-bottom: 6px;
}
.footer-name em {
	color: var(--gold-light);
	font-style: italic;
	font-weight: 500;
}

/* ═══════════════════════════════════════════════════════════
   v0.3.2 — All Prayers page
   ═══════════════════════════════════════════════════════════ */

/* ─── Page header ──────────────────────────────────────── */
.prayers-header {
	background: linear-gradient(180deg, var(--parchment) 0%, var(--cream) 100%);
	padding: 70px 32px 50px;
	text-align: center;
	border-bottom: 1px solid var(--cream-dark);
}
.prayers-header-inner { max-width: 760px; margin: 0 auto; }
.prayers-header-eyebrow {
	font-style: italic;
	color: var(--gold);
	font-size: 13px;
	letter-spacing: 3px;
	text-transform: uppercase;
	margin-bottom: 12px;
	display: block;
}
.prayers-header-title {
	font-family: var(--font-display);
	font-size: clamp(34px, 5vw, 50px);
	font-weight: 500;
	color: var(--brown-dark);
	letter-spacing: -.3px;
	margin: 0;
	line-height: 1.1;
}
.prayers-header-title em { color: var(--gold); font-style: italic; font-weight: 400; }
.prayers-header-subtitle {
	margin: 16px auto 28px;
	font-size: 17px;
	color: var(--brown);
	font-style: italic;
}
.prayers-search { max-width: 460px; margin: 0 auto; }
.prayers-search input {
	width: 100%;
	padding: 13px 18px;
	font-size: 16px;
	font-family: var(--font-body);
	border: 1.5px solid var(--cream-dark);
	border-radius: 4px;
	background: var(--white);
	color: var(--brown-dark);
	transition: border-color .2s;
	box-sizing: border-box;
}
.prayers-search input:focus {
	outline: none;
	border-color: var(--gold);
}
.prayers-search input::placeholder { color: var(--gold-light); font-style: italic; }

/* ─── Listing ──────────────────────────────────────────── */
.prayers-listing { padding: 60px 32px 80px; background: var(--cream); }
.prayers-listing-inner { max-width: 880px; margin: 0 auto; }

.prayers-cat-group {
	margin-bottom: 48px;
}
.prayers-cat-heading {
	font-family: var(--font-display);
	font-size: 26px;
	font-weight: 600;
	color: var(--brown-dark);
	margin: 0 0 18px;
	padding-bottom: 12px;
	border-bottom: 1px solid var(--gold-pale);
	display: flex;
	align-items: center;
	gap: 10px;
}
.prayers-cat-heading a { color: inherit; text-decoration: none; }
.prayers-cat-heading a:hover { color: var(--gold); }
.prayers-cat-icon { color: var(--gold); display: inline-flex; }
.prayers-cat-icon .tf-icon { width: 24px; height: 24px; }

.prayers-cat-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 8px 24px;
}
@media (max-width: 720px) { .prayers-cat-list { grid-template-columns: 1fr; } }

.prayers-item {
	border-bottom: 1px solid var(--cream-dark);
}
.prayers-item:last-child { border-bottom: none; }

.prayers-item-link {
	display: block;
	padding: 14px 4px;
	color: var(--brown-dark);
	text-decoration: none;
	transition: padding-left .2s, color .2s;
}
.prayers-item-link:hover {
	color: var(--gold);
	padding-left: 8px;
}

.prayers-item-title {
	display: block;
	font-family: var(--font-display);
	font-size: 18px;
	font-weight: 600;
	line-height: 1.3;
	margin-bottom: 3px;
}
.prayers-item-excerpt {
	display: block;
	font-size: 13px;
	color: var(--brown);
	font-style: italic;
	line-height: 1.5;
}

.prayers-empty {
	text-align: center;
	color: var(--brown);
	font-style: italic;
	padding: 60px 0;
	font-size: 17px;
}

/* ═══════════════════════════════════════════════════════════
   v0.3.2 — Featured prayers mobile (1 column)
   ═══════════════════════════════════════════════════════════ */
@media (max-width: 720px) {
	.hp-featured-grid {
		grid-template-columns: 1fr !important;
	}
	.hp-featured-grid .hp-prayer-card:nth-child(n+2) {
		display: none;
	}
}

/* ═══════════════════════════════════════════════════════════
   v0.4.0 — Daily Tehillim
   ═══════════════════════════════════════════════════════════ */
.tehillim-daily {
	background: var(--cream, #f5f0e8);
	padding: 60px 24px 80px;
	min-height: 60vh;
}
.tehillim-daily-inner {
	max-width: 760px;
	margin: 0 auto;
}

.tehillim-header {
	text-align: center;
	margin-bottom: 48px;
}
.tehillim-eyebrow {
	display: inline-block;
	font-style: italic;
	color: var(--gold, #9b7d3a);
	font-size: 13px;
	letter-spacing: 3px;
	text-transform: uppercase;
	margin-bottom: 12px;
}
.tehillim-title {
	font-family: var(--font-display, serif);
	font-size: clamp(36px, 5vw, 52px);
	font-weight: 500;
	color: var(--brown-dark, #3d2c14);
	margin: 0;
	line-height: 1.1;
}
.tehillim-subtitle {
	font-size: 16px;
	color: var(--brown, #6b4f2a);
	font-style: italic;
	margin-top: 12px;
}

.tehillim-assignment {
	background: #fff;
	border: 1px solid var(--cream-dark, #e0d6c4);
	border-radius: 8px;
	padding: 36px 32px;
	margin-bottom: 48px;
}
.tehillim-range-card {
	text-align: center;
	padding-bottom: 28px;
	border-bottom: 1px solid var(--cream-dark, #e0d6c4);
	margin-bottom: 28px;
}
.tehillim-range-label {
	color: var(--brown, #6b4f2a);
	font-size: 13px;
	letter-spacing: 2px;
	text-transform: uppercase;
	margin-bottom: 6px;
}
.tehillim-range {
	font-family: var(--font-display, serif);
	font-size: 36px;
	font-weight: 600;
	color: var(--gold, #9b7d3a);
}

.tehillim-psalms-list {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
	gap: 8px;
}
.tehillim-psalm-link {
	display: block;
	padding: 12px 16px;
	background: var(--cream, #f5f0e8);
	color: var(--brown-dark, #3d2c14);
	text-decoration: none;
	border-radius: 4px;
	font-family: var(--font-display, serif);
	font-size: 16px;
	transition: background .15s, color .15s;
	text-align: center;
}
.tehillim-psalm-link:hover {
	background: var(--gold, #9b7d3a);
	color: #fff;
}

.tehillim-tradition {
	margin: 56px 0;
	padding: 32px;
	background: rgba(155, 125, 58, 0.06);
	border-left: 3px solid var(--gold, #9b7d3a);
	border-radius: 0 6px 6px 0;
}
.tehillim-tradition h2 {
	font-family: var(--font-display, serif);
	font-size: 22px;
	color: var(--brown-dark, #3d2c14);
	margin: 0 0 12px;
}
.tehillim-tradition p {
	font-size: 15px;
	color: #444;
	line-height: 1.7;
	margin: 0 0 12px;
}
.tehillim-tradition p:last-child { margin-bottom: 0; }

.tehillim-nav h2 {
	font-family: var(--font-display, serif);
	font-size: 24px;
	color: var(--brown-dark, #3d2c14);
	margin-bottom: 20px;
	text-align: center;
}
.tehillim-day-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
	gap: 8px;
}
.tehillim-day-pill {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 12px 6px;
	background: #fff;
	border: 1px solid var(--cream-dark, #e0d6c4);
	border-radius: 4px;
	color: var(--brown-dark, #3d2c14);
	text-decoration: none;
	transition: all .15s;
	text-align: center;
}
.tehillim-day-pill:hover {
	border-color: var(--gold, #9b7d3a);
	background: rgba(155, 125, 58, 0.05);
}
.tehillim-day-pill.is-active {
	background: var(--gold, #9b7d3a);
	border-color: var(--gold, #9b7d3a);
	color: #fff;
}
.tehillim-day-num {
	font-family: var(--font-display, serif);
	font-size: 22px;
	font-weight: 600;
	line-height: 1;
}
.tehillim-day-range {
	font-size: 11px;
	margin-top: 4px;
	opacity: .85;
}

@media (max-width: 600px) {
	.tehillim-day-grid { grid-template-columns: repeat(auto-fill, minmax(90px, 1fr)); }
	.tehillim-psalms-list { grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); }
}

/* v0.4.2 — psalm links to Sefaria (external) */
.tehillim-psalm-link {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
}
.tehillim-psalm-ext {
	font-size: 13px;
	opacity: .55;
	font-weight: 400;
}
.tehillim-source-note {
	margin-top: 24px;
	padding: 16px 20px;
	background: rgba(155, 125, 58, 0.08);
	border-left: 3px solid var(--gold, #9b7d3a);
	border-radius: 0 4px 4px 0;
	font-size: 14px;
	color: #555;
	line-height: 1.6;
}
.tehillim-source-note a {
	color: var(--gold, #9b7d3a);
	font-weight: 500;
}
.tehillim-source-note em {
	display: block;
	margin-top: 6px;
	color: #888;
	font-size: 13px;
}

/* ═══════════════════════════════════════════════════════════
   v0.5.0 — Psalm pages
   ═══════════════════════════════════════════════════════════ */
.psalm-page { background: var(--cream, #f5f0e8); }

.psalm-header {
	background: linear-gradient(180deg, #fff 0%, var(--cream, #f5f0e8) 100%);
	border-bottom: 1px solid var(--cream-dark, #e0d6c4);
	padding: 56px 24px 40px;
}
.psalm-header-inner {
	max-width: 760px;
	margin: 0 auto;
	text-align: center;
}
.psalm-breadcrumb {
	font-size: 13px;
	color: var(--brown, #6b4f2a);
	margin-bottom: 16px;
}
.psalm-breadcrumb a {
	color: var(--gold, #9b7d3a);
	text-decoration: none;
}
.psalm-breadcrumb a:hover { text-decoration: underline; }
.psalm-breadcrumb-sep {
	margin: 0 8px;
	opacity: .5;
}
.psalm-title {
	font-family: var(--font-display, serif);
	font-size: clamp(40px, 6vw, 60px);
	font-weight: 500;
	color: var(--brown-dark, #3d2c14);
	margin: 0 0 6px;
	line-height: 1.1;
}
.psalm-subtitle {
	font-family: var(--font-display, serif);
	font-size: 24px;
	color: var(--gold, #9b7d3a);
	font-weight: 400;
	margin: 0;
	direction: rtl;
}

.psalm-quicknav {
	max-width: 760px;
	margin: 0 auto;
	padding: 16px 24px;
	display: flex;
	justify-content: space-between;
	gap: 8px;
	border-bottom: 1px solid var(--cream-dark, #e0d6c4);
	background: #fff;
}
.psalm-nav-btn {
	padding: 8px 16px;
	background: var(--cream, #f5f0e8);
	color: var(--brown-dark, #3d2c14);
	text-decoration: none;
	border-radius: 4px;
	font-size: 14px;
	transition: background .15s;
}
.psalm-nav-btn:hover {
	background: var(--gold, #9b7d3a);
	color: #fff;
}
.psalm-nav-disabled {
	visibility: hidden;
}
.psalm-nav-list {
	font-weight: 500;
}

.psalm-body {
	padding: 56px 24px 40px;
}
.psalm-body-inner {
	max-width: 880px;
	margin: 0 auto;
}

.psalm-verses {
	display: flex;
	flex-direction: column;
	gap: 24px;
}
.psalm-verse {
	display: grid;
	grid-template-columns: 36px 1fr 1fr;
	gap: 20px;
	align-items: start;
	padding: 18px 0;
	border-bottom: 1px solid var(--cream-dark, #e0d6c4);
}
.psalm-verse:last-child { border-bottom: none; }

.psalm-verse-num {
	font-family: var(--font-display, serif);
	font-size: 18px;
	color: var(--gold, #9b7d3a);
	font-weight: 500;
	text-align: center;
	padding-top: 4px;
	user-select: none;
}

.psalm-verse-he {
	font-family: var(--font-display-he, "Frank Ruhl Libre", "David", serif);
	font-size: 20px;
	line-height: 1.7;
	color: var(--brown-dark, #3d2c14);
	text-align: right;
	direction: rtl;
}

.psalm-verse-en {
	font-family: var(--font-body, system-ui);
	font-size: 16px;
	line-height: 1.7;
	color: #333;
}

.psalm-empty {
	text-align: center;
	padding: 80px 0;
	color: #888;
	font-style: italic;
}

.psalm-footer {
	background: rgba(155, 125, 58, 0.06);
	border-top: 1px solid var(--cream-dark, #e0d6c4);
	padding: 32px 24px;
	text-align: center;
}
.psalm-footer-inner {
	max-width: 760px;
	margin: 0 auto;
}
.psalm-source {
	font-size: 13px;
	color: #555;
	margin: 0 0 6px;
}
.psalm-source-credit {
	font-size: 12px;
	color: #888;
	margin: 0;
}
.psalm-source-credit a {
	color: var(--gold, #9b7d3a);
}

/* Mobile: stack hebrew above english (1 column instead of 2) */
@media (max-width: 720px) {
	.psalm-verse {
		grid-template-columns: 30px 1fr;
	}
	.psalm-verse-he,
	.psalm-verse-en {
		grid-column: 2;
	}
	.psalm-verse-he {
		font-size: 18px;
		margin-bottom: 8px;
	}
	.psalm-verse-en {
		font-size: 15px;
	}
	.psalm-quicknav {
		font-size: 13px;
	}
	.psalm-nav-btn {
		padding: 6px 12px;
		font-size: 13px;
	}
}

.tehillim-psalm-pending {
	cursor: not-allowed;
	opacity: 0.55;
	pointer-events: none;
}
.tehillim-psalm-pending:hover {
	background: var(--cream, #f5f0e8) !important;
	color: inherit !important;
}

/* ═══════════════════════════════════════════════════════════
   v0.5.4 — Donate page
   ═══════════════════════════════════════════════════════════ */
.donate-page { background: var(--cream, #f5f0e8); }

.donate-header {
	background: linear-gradient(180deg, #fff 0%, var(--cream, #f5f0e8) 100%);
	border-bottom: 1px solid var(--cream-dark, #e0d6c4);
	padding: 64px 24px 48px;
}
.donate-header-inner {
	max-width: 700px;
	margin: 0 auto;
	text-align: center;
}
.donate-eyebrow {
	display: inline-block;
	font-style: italic;
	color: var(--gold, #9b7d3a);
	font-size: 13px;
	letter-spacing: 3px;
	text-transform: uppercase;
	margin-bottom: 14px;
}
.donate-title {
	font-family: var(--font-display, serif);
	font-size: clamp(40px, 5vw, 56px);
	font-weight: 500;
	color: var(--brown-dark, #3d2c14);
	margin: 0 0 10px;
	line-height: 1.1;
}
.donate-subtitle {
	font-size: 17px;
	color: var(--brown, #6b4f2a);
	font-style: italic;
	margin: 0;
}

.donate-body {
	padding: 56px 24px 80px;
}
.donate-body-inner {
	max-width: 880px;
	margin: 0 auto;
}

.donate-pillars {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
	margin-bottom: 48px;
}
.donate-pillar {
	background: #fff;
	border: 1px solid var(--cream-dark, #e0d6c4);
	border-radius: 8px;
	padding: 28px 24px;
	text-align: center;
}
.donate-pillar-icon {
	font-size: 36px;
	margin-bottom: 12px;
	line-height: 1;
}
.donate-pillar h3 {
	font-family: var(--font-display, serif);
	font-size: 19px;
	color: var(--brown-dark, #3d2c14);
	margin: 0 0 8px;
}
.donate-pillar p {
	font-size: 14px;
	line-height: 1.6;
	color: #555;
	margin: 0;
}

.donate-cta-card {
	background: #fff;
	border: 2px solid var(--gold, #9b7d3a);
	border-radius: 10px;
	padding: 40px 36px;
	text-align: center;
	box-shadow: 0 4px 24px rgba(155, 125, 58, 0.08);
}
.donate-cta-card h2 {
	font-family: var(--font-display, serif);
	font-size: 30px;
	color: var(--brown-dark, #3d2c14);
	margin: 0 0 10px;
}
.donate-cta-card > p {
	font-size: 16px;
	color: #555;
	max-width: 480px;
	margin: 0 auto 28px;
	line-height: 1.6;
}
.donate-paypal-wrap {
	display: flex;
	justify-content: center;
	align-items: center;
	min-height: 60px;
	margin: 0 0 20px;
}
.donate-paypal-wrap form {
	margin: 0 !important;
}
.donate-fineprint {
	font-size: 12px;
	color: #888;
	margin: 0;
	font-style: italic;
}

.donate-extra {
	margin-top: 48px;
	padding: 24px 0 0;
	border-top: 1px solid var(--cream-dark, #e0d6c4);
	font-size: 15px;
	line-height: 1.7;
	color: #444;
}
.donate-extra p { margin: 0 0 12px; }

@media (max-width: 720px) {
	.donate-pillars {
		grid-template-columns: 1fr;
		gap: 14px;
	}
	.donate-cta-card {
		padding: 32px 22px;
	}
	.donate-cta-card h2 {
		font-size: 26px;
	}
}

/* ═══════════════════════════════════════════════════════════
   v0.5.6 — All Articles archive page
   ═══════════════════════════════════════════════════════════ */
.articles-archive { background: var(--cream, #f5f0e8); }

.articles-archive-header {
	background: linear-gradient(180deg, #fff 0%, var(--cream, #f5f0e8) 100%);
	border-bottom: 1px solid var(--cream-dark, #e0d6c4);
	padding: 56px 24px 40px;
}
.articles-archive-header-inner {
	max-width: 760px;
	margin: 0 auto;
	text-align: center;
}
.articles-archive-eyebrow {
	display: inline-block;
	font-style: italic;
	color: var(--gold, #9b7d3a);
	font-size: 13px;
	letter-spacing: 3px;
	text-transform: uppercase;
	margin-bottom: 12px;
}
.articles-archive-title {
	font-family: var(--font-display, serif);
	font-size: clamp(36px, 5vw, 52px);
	font-weight: 500;
	color: var(--brown-dark, #3d2c14);
	margin: 0 0 12px;
	line-height: 1.1;
}
.articles-archive-subtitle {
	font-size: 16px;
	color: var(--brown, #6b4f2a);
	font-style: italic;
	margin: 0;
}

.articles-archive-body {
	padding: 56px 24px 80px;
}
.articles-archive-inner {
	max-width: 820px;
	margin: 0 auto;
}
.articles-archive-empty {
	text-align: center;
	padding: 80px 0;
	color: #888;
	font-style: italic;
	font-size: 17px;
}

.articles-cat-block {
	margin-bottom: 56px;
}
.articles-cat-header {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 16px;
	border-bottom: 2px solid var(--gold, #9b7d3a);
	padding-bottom: 10px;
	margin-bottom: 16px;
}
.articles-cat-name {
	font-family: var(--font-display, serif);
	font-size: 28px;
	color: var(--brown-dark, #3d2c14);
	margin: 0;
	font-weight: 500;
}
.articles-cat-link {
	font-size: 13px;
	color: var(--gold, #9b7d3a);
	text-decoration: none;
	white-space: nowrap;
}
.articles-cat-link:hover { text-decoration: underline; }
.articles-cat-desc {
	color: #666;
	font-size: 14px;
	font-style: italic;
	margin: 0 0 18px;
	line-height: 1.6;
}

.articles-cat-list {
	display: flex;
	flex-direction: column;
	gap: 0;
}
.articles-list-item {
	border-bottom: 1px solid var(--cream-dark, #e0d6c4);
}
.articles-list-item:last-child { border-bottom: none; }

.articles-list-link {
	display: block;
	padding: 20px 4px;
	text-decoration: none;
	color: inherit;
	transition: padding-left .15s, background .15s;
}
.articles-list-link:hover {
	padding-left: 12px;
	background: rgba(155, 125, 58, 0.04);
}

.articles-list-title {
	font-family: var(--font-display, serif);
	font-size: 22px;
	color: var(--brown-dark, #3d2c14);
	margin: 0 0 6px;
	font-weight: 500;
	line-height: 1.3;
}
.articles-list-excerpt {
	color: #555;
	font-size: 15px;
	line-height: 1.6;
	margin: 0 0 8px;
}
.articles-list-meta {
	font-size: 12px;
	color: #999;
	letter-spacing: 1px;
	text-transform: uppercase;
}

@media (max-width: 600px) {
	.articles-cat-header {
		flex-direction: column;
		align-items: flex-start;
		gap: 4px;
	}
	.articles-cat-name { font-size: 24px; }
	.articles-list-title { font-size: 19px; }
}

/* ═══════════════════════════════════════════════════════════
   v0.5.7 — Related content (articles/prayers/donate) section
   ═══════════════════════════════════════════════════════════ */
.related-content {
	background: var(--cream-dark, #ede4d2);
	padding: 64px 24px 56px;
	border-top: 1px solid rgba(155, 125, 58, 0.2);
	margin-top: 48px;
}
.related-content-inner {
	max-width: 1080px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 36px;
}

.related-block {
	min-width: 0;
}
.related-block.related-donate {
	grid-column: 1 / -1; /* full width across both columns */
	margin-top: 16px;
}

.related-title {
	font-family: var(--font-display, serif);
	font-size: 24px;
	font-weight: 500;
	color: var(--brown-dark, #3d2c14);
	margin: 0 0 16px;
	padding-bottom: 8px;
	border-bottom: 1.5px solid var(--gold, #9b7d3a);
}

.related-list {
	display: flex;
	flex-direction: column;
	gap: 0;
	margin-bottom: 14px;
}

.related-item {
	display: block;
	padding: 14px 4px;
	border-bottom: 1px solid rgba(107, 79, 42, 0.15);
	text-decoration: none;
	color: inherit;
	transition: padding-left .15s, background .15s;
}
.related-item:last-child { border-bottom: none; }
.related-item:hover {
	padding-left: 10px;
	background: rgba(255, 255, 255, 0.4);
}

.related-item-eyebrow {
	display: inline-block;
	font-size: 11px;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	color: var(--gold, #9b7d3a);
	margin-bottom: 4px;
}
.related-item-title {
	font-family: var(--font-display, serif);
	font-size: 17px;
	color: var(--brown-dark, #3d2c14);
	margin: 0 0 4px;
	font-weight: 500;
	line-height: 1.3;
}
.related-item-excerpt {
	font-size: 13px;
	color: #5a4a36;
	line-height: 1.5;
	margin: 0;
}

.related-list-prayers .related-item {
	padding: 12px 4px;
}
.related-list-prayers .related-item-title {
	font-size: 16px;
	margin-bottom: 0;
}

.related-block-link {
	display: inline-block;
	font-size: 13px;
	color: var(--gold, #9b7d3a);
	text-decoration: none;
	font-weight: 500;
	margin-top: 6px;
}
.related-block-link:hover { text-decoration: underline; }

/* ─── Donation card ─── */
.related-donate-card {
	background: linear-gradient(135deg, #fff 0%, var(--cream, #f5f0e8) 100%);
	border: 2px solid var(--gold, #9b7d3a);
	border-radius: 10px;
	padding: 36px 32px;
	text-align: center;
	box-shadow: 0 2px 16px rgba(155, 125, 58, 0.1);
}
.related-donate-icon {
	font-size: 38px;
	line-height: 1;
	margin-bottom: 10px;
}
.related-donate-title {
	font-family: var(--font-display, serif);
	font-size: 26px;
	color: var(--brown-dark, #3d2c14);
	margin: 0 0 10px;
	font-weight: 500;
}
.related-donate-text {
	font-size: 15px;
	color: #555;
	max-width: 540px;
	margin: 0 auto 22px;
	line-height: 1.6;
}
.related-donate-btn {
	display: inline-block;
	background: var(--gold, #9b7d3a);
	color: #fff;
	text-decoration: none;
	padding: 12px 32px;
	border-radius: 4px;
	font-size: 15px;
	font-weight: 500;
	transition: background .15s, transform .1s;
}
.related-donate-btn:hover {
	background: var(--brown, #6b4f2a);
}
.related-donate-btn:active {
	transform: translateY(1px);
}

@media (max-width: 720px) {
	.related-content-inner {
		grid-template-columns: 1fr;
		gap: 28px;
	}
	.related-content {
		padding: 48px 20px 40px;
	}
	.related-donate-card {
		padding: 28px 22px;
	}
	.related-donate-title {
		font-size: 22px;
	}
}

/* ═══════════════════════════════════════════════════════════
   v0.5.9 — Contact page
   ═══════════════════════════════════════════════════════════ */
.contact-page { background: var(--cream, #f5f0e8); }

.contact-header {
	background: linear-gradient(180deg, #fff 0%, var(--cream, #f5f0e8) 100%);
	border-bottom: 1px solid var(--cream-dark, #e0d6c4);
	padding: 56px 24px 40px;
}
.contact-header-inner {
	max-width: 700px;
	margin: 0 auto;
	text-align: center;
}
.contact-eyebrow {
	display: inline-block;
	font-style: italic;
	color: var(--gold, #9b7d3a);
	font-size: 13px;
	letter-spacing: 3px;
	text-transform: uppercase;
	margin-bottom: 12px;
}
.contact-title {
	font-family: var(--font-display, serif);
	font-size: clamp(40px, 5vw, 56px);
	font-weight: 500;
	color: var(--brown-dark, #3d2c14);
	margin: 0 0 12px;
	line-height: 1.1;
}
.contact-subtitle {
	font-size: 17px;
	color: var(--brown, #6b4f2a);
	font-style: italic;
	margin: 0;
	max-width: 540px;
	margin-left: auto;
	margin-right: auto;
	line-height: 1.5;
}

.contact-body {
	padding: 48px 24px 80px;
}
.contact-body-inner {
	max-width: 600px;
	margin: 0 auto;
}
.contact-intro {
	margin-bottom: 32px;
	font-size: 16px;
	line-height: 1.6;
	color: #444;
}
.contact-intro p { margin: 0 0 12px; }

.contact-form {
	background: #fff;
	border: 1px solid var(--cream-dark, #e0d6c4);
	border-radius: 8px;
	padding: 36px 32px;
	display: flex;
	flex-direction: column;
	gap: 18px;
}
.contact-field label {
	display: block;
	font-size: 13px;
	color: #444;
	margin-bottom: 5px;
	font-weight: 500;
}
.contact-required { color: #c43e3e; }
.contact-field input,
.contact-field select,
.contact-field textarea {
	width: 100%;
	padding: 10px 12px;
	font-size: 15px;
	border: 1.5px solid #ccc;
	border-radius: 4px;
	background: #fff;
	font-family: inherit;
	box-sizing: border-box;
	color: #333;
}
.contact-field textarea {
	resize: vertical;
	min-height: 120px;
	line-height: 1.5;
}
.contact-field input:focus,
.contact-field select:focus,
.contact-field textarea:focus {
	outline: none;
	border-color: var(--gold, #9b7d3a);
}

.contact-actions {
	margin-top: 4px;
}
.contact-submit {
	background: var(--gold, #9b7d3a);
	color: #fff;
	border: none;
	padding: 14px 36px;
	font-size: 16px;
	border-radius: 4px;
	cursor: pointer;
	width: 100%;
	font-family: inherit;
	transition: background .15s;
}
.contact-submit:hover {
	background: var(--brown, #6b4f2a);
}
.contact-submit:disabled {
	opacity: .5;
	cursor: not-allowed;
}

.contact-status {
	padding: 12px 14px;
	border-radius: 4px;
	font-size: 14px;
	line-height: 1.5;
}
.contact-status:empty { display: none; }
.contact-status.is-success {
	background: #e8f5e9;
	color: #2d6a31;
	border: 1px solid #b9d8b9;
}
.contact-status.is-error {
	background: #fdecea;
	color: #8b1f1f;
	border: 1px solid #f1c0c0;
}

@media (max-width: 600px) {
	.contact-form { padding: 28px 20px; }
}

/* ═══════════════════════════════════════════════════════════
   v0.5.10 — Daily Tehillim hero block on homepage
   ═══════════════════════════════════════════════════════════ */
.hp-daily-tehillim {
	padding: 0 24px;
	margin: -28px 0 32px;
	position: relative;
	z-index: 2;
}
.hp-daily-inner {
	max-width: 1100px;
	margin: 0 auto;
}

.hp-daily-card {
	background: linear-gradient(135deg, #6b4f2a 0%, #9b7d3a 100%);
	border-radius: 12px;
	padding: 36px 40px;
	color: #fff;
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 40px;
	align-items: center;
	box-shadow: 0 8px 32px rgba(107, 79, 42, 0.25);
	position: relative;
	overflow: hidden;
}
/* subtle decorative bg */
.hp-daily-card::before {
	content: '';
	position: absolute;
	top: -40%;
	right: -10%;
	width: 280px;
	height: 280px;
	background: radial-gradient(circle, rgba(255,255,255,0.08) 0%, transparent 70%);
	pointer-events: none;
}

.hp-daily-left {
	min-width: 0;
	position: relative;
	z-index: 1;
}
.hp-daily-eyebrow {
	display: inline-block;
	font-size: 12px;
	letter-spacing: 2px;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.75);
	margin-bottom: 10px;
	font-style: normal;
}
.hp-daily-title {
	font-family: var(--font-display, serif);
	font-size: clamp(28px, 3.5vw, 38px);
	font-weight: 500;
	margin: 0 0 10px;
	line-height: 1.1;
	color: #fff;
}
.hp-daily-title em {
	font-style: italic;
	color: #fff5e0;
}
.hp-daily-subtitle {
	font-size: 15px;
	line-height: 1.55;
	color: rgba(255, 255, 255, 0.88);
	margin: 0;
	max-width: 520px;
}

.hp-daily-right {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 14px;
	position: relative;
	z-index: 1;
}

.hp-daily-day-badge {
	background: rgba(255, 255, 255, 0.13);
	border: 1px solid rgba(255, 255, 255, 0.25);
	border-radius: 10px;
	padding: 14px 26px;
	display: flex;
	flex-direction: column;
	align-items: center;
	min-width: 130px;
	backdrop-filter: blur(4px);
}
.hp-daily-day-label {
	font-size: 11px;
	letter-spacing: 2px;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.75);
	margin-bottom: 2px;
}
.hp-daily-day-num {
	font-family: var(--font-display, serif);
	font-size: 56px;
	font-weight: 600;
	line-height: 1;
	color: #fff;
}
.hp-daily-day-of {
	font-size: 11px;
	color: rgba(255, 255, 255, 0.6);
	margin-top: 2px;
}

.hp-daily-range {
	text-align: center;
}
.hp-daily-range-label {
	display: block;
	font-size: 11px;
	letter-spacing: 2px;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.7);
	margin-bottom: 2px;
}
.hp-daily-range-value {
	font-family: var(--font-display, serif);
	font-size: 24px;
	font-weight: 500;
	color: #fff;
}

.hp-daily-cta {
	display: inline-block;
	background: #fff;
	color: var(--brown-dark, #3d2c14);
	text-decoration: none;
	padding: 11px 26px;
	border-radius: 6px;
	font-size: 14px;
	font-weight: 600;
	transition: transform .15s, box-shadow .15s;
	white-space: nowrap;
}
.hp-daily-cta:hover {
	transform: translateY(-1px);
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
}

@media (max-width: 760px) {
	.hp-daily-tehillim {
		margin: -20px 0 24px;
		padding: 0 16px;
	}
	.hp-daily-card {
		grid-template-columns: 1fr;
		padding: 28px 24px;
		gap: 24px;
		text-align: center;
	}
	.hp-daily-subtitle {
		max-width: none;
	}
	.hp-daily-right {
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: center;
		gap: 16px;
	}
	.hp-daily-day-badge {
		min-width: 110px;
		padding: 12px 20px;
	}
	.hp-daily-day-num {
		font-size: 44px;
	}
	.hp-daily-cta {
		flex: 1 0 100%;
		text-align: center;
	}
}

/* ═══════════════════════════════════════════════════════════
   v0.5.12 — Share buttons
   ═══════════════════════════════════════════════════════════ */
.share-buttons {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
	padding: 20px 0;
	border-top: 1px solid var(--cream-dark, #e0d6c4);
	margin-top: 28px;
}
.prayer-share { padding: 0 0 8px; }
.article-share { max-width: 820px; margin: 0 auto; padding: 0 24px; }

.share-label {
	font-size: 12px;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	color: #999;
	margin-right: 4px;
}

.share-btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 14px;
	border-radius: 20px;
	font-size: 13px;
	font-weight: 500;
	text-decoration: none;
	border: 1.5px solid transparent;
	cursor: pointer;
	transition: transform .1s, box-shadow .15s, opacity .15s;
	font-family: inherit;
}
.share-btn:hover {
	transform: translateY(-1px);
	box-shadow: 0 3px 10px rgba(0,0,0,.12);
}
.share-btn:active { transform: none; opacity: .85; }

.share-btn--whatsapp {
	background: #25D366;
	color: #fff;
	border-color: #25D366;
}
.share-btn--twitter {
	background: #000;
	color: #fff;
	border-color: #000;
}
.share-btn--facebook {
	background: #1877F2;
	color: #fff;
	border-color: #1877F2;
}
.share-btn--copy {
	background: transparent;
	color: var(--brown, #6b4f2a);
	border-color: var(--cream-dark, #e0d6c4);
}
.share-btn--copy:hover {
	background: var(--cream, #f5f0e8);
	border-color: var(--brown, #6b4f2a);
}

@media (max-width: 480px) {
	.share-btn span { display: none; }
	.share-btn { padding: 9px 12px; border-radius: 50%; }
	.share-btn svg { width: 20px; height: 20px; }
}

/* ═══════════════════════════════════════════════════════════
   v0.5.15 — Yahrzeit Tehillim pages
   ═══════════════════════════════════════════════════════════ */

/* ── Landing ── */
.yh-how {
	background: linear-gradient(160deg, var(--brown-d,#3d2c14) 0%, #5a3818 60%, var(--brown,#6b4f2a) 100%);
	padding: 64px 24px 48px;
	text-align: center;
	position: relative;
	overflow: hidden;
}
.yh-how::before {
	content: '';
	position: absolute;
	inset: 0;
	background: radial-gradient(ellipse at 80% 20%, rgba(255,255,255,.05) 0%, transparent 60%);
	pointer-events: none;
}
.yh-how-eyebrow {
	display: inline-block;
	background: rgba(255,255,255,.1);
	border: 1px solid rgba(255,255,255,.2);
	color: rgba(255,255,255,.85);
	font-size: 12px;
	letter-spacing: 3px;
	text-transform: uppercase;
	padding: 5px 18px;
	border-radius: 20px;
	margin-bottom: 18px;
}
.yh-how-title {
	font-family: 'Cormorant Garamond', 'Frank Ruhl Libre', serif;
	font-size: clamp(36px, 5vw, 58px);
	font-weight: 500;
	color: #fff;
	line-height: 1.1;
	margin: 0 0 12px;
}
.yh-how-title em { font-style: italic; color: #f5d98a; }
.yh-how-subtitle {
	font-size: 16px;
	color: rgba(255,255,255,.75);
	max-width: 520px;
	margin: 0 auto 40px;
	line-height: 1.65;
}
.yh-steps {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
	max-width: 820px;
	margin: 0 auto;
	position: relative;
	z-index: 1;
}
.yh-step {
	background: rgba(255,255,255,.07);
	border: 1px solid rgba(255,255,255,.15);
	border-radius: 10px;
	padding: 24px 20px;
	text-align: center;
}
.yh-step-icon { font-size: 36px; margin-bottom: 10px; }
.yh-step h3 {
	font-family: 'Cormorant Garamond', serif;
	font-size: 18px;
	color: #fff;
	margin: 0 0 8px;
}
.yh-step p { font-size: 13px; color: rgba(255,255,255,.7); line-height: 1.55; margin: 0; }

.yh-form-section {
	padding: 0 24px 64px;
	background: linear-gradient(180deg, #4a2e0e 0%, var(--cream,#f5f0e8) 120px);
}
.yh-form-card {
	background: var(--white,#fffdf8);
	border-radius: 14px;
	padding: 36px 40px;
	max-width: 580px;
	margin: 0 auto;
	box-shadow: 0 20px 60px rgba(0,0,0,.22);
	position: relative;
	top: -32px;
}
.yh-form-title {
	font-family: 'Cormorant Garamond', serif;
	font-size: 24px;
	color: var(--brown-d,#3d2c14);
	margin: 0 0 22px;
	font-weight: 600;
}
.yh-field { margin-bottom: 16px; }
.yh-field label {
	display: block;
	font-size: 12px;
	font-weight: 600;
	color: var(--text-soft,#6b5a42);
	letter-spacing: .5px;
	text-transform: uppercase;
	margin-bottom: 6px;
}
.yh-req { color: #c43; }
.yh-field input, .yh-field select {
	width: 100%;
	padding: 10px 14px;
	font-size: 15px;
	border: 1.5px solid var(--cream-dp,#ddd0bc);
	border-radius: 6px;
	background: var(--cream,#f5f0e8);
	font-family: inherit;
	color: var(--text,#2a1f0f);
	box-sizing: border-box;
	transition: border-color .15s;
}
.yh-field input:focus, .yh-field select:focus {
	outline: none;
	border-color: var(--gold,#9b7d3a);
	background: #fffdf5;
}
.yh-hint { font-size: 11px; color: #aaa; margin-top: 4px; }
.yh-field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }

.yh-letters-preview {
	margin-top: 8px;
	font-size: 13px;
	color: var(--text-soft,#6b5a42);
	display: flex;
	align-items: center;
	gap: 5px;
	flex-wrap: wrap;
}
.yh-prev-label { color: #aaa; }
.yh-prev-plus { color: #aaa; margin: 0 3px; }
.yh-letter-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	font-family: 'Frank Ruhl Libre', serif;
	font-size: 17px;
	font-weight: 600;
}
.yh-letter-badge.name { background: var(--gold,#9b7d3a); color: #fff; }
.yh-letter-badge.neshama { background: var(--cream-d,#e8dfd0); color: var(--brown,#6b4f2a); border: 1px solid var(--gold,#9b7d3a); }
.yh-letter-badge.sm { width: 24px; height: 24px; font-size: 14px; }

.yh-remind-chips {
	display: flex;
	gap: 6px;
	flex-wrap: wrap;
	margin-top: 8px;
	align-items: center;
}
.yh-chip {
	padding: 5px 13px;
	border-radius: 20px;
	border: 1.5px solid var(--cream-dp,#ddd0bc);
	background: #fff;
	font-size: 12px;
	color: var(--brown,#6b4f2a);
	cursor: pointer;
	font-family: inherit;
	transition: all .15s;
}
.yh-chip:hover, .yh-chip.sel {
	background: var(--gold,#9b7d3a);
	color: #fff;
	border-color: var(--gold,#9b7d3a);
}

.yh-submit-btn {
	width: 100%;
	padding: 14px;
	background: var(--gold,#9b7d3a);
	color: #fff;
	border: none;
	border-radius: 8px;
	font-size: 15px;
	font-weight: 600;
	cursor: pointer;
	font-family: inherit;
	transition: background .15s;
	margin-top: 8px;
}
.yh-submit-btn:hover { background: var(--brown,#6b4f2a); }
.yh-submit-btn:disabled { opacity: .6; cursor: not-allowed; }
.yh-fine { text-align: center; font-size: 11px; color: #bbb; margin-top: 10px; }
.yh-form-msg {
	padding: 10px 14px;
	border-radius: 6px;
	font-size: 13px;
	margin-bottom: 14px;
}
.yh-form-msg.is-error { background: #fdecea; color: #8b1f1f; border: 1px solid #f1c0c0; }
.yh-form-msg.is-success { background: #e8f5e9; color: #2d6a31; border: 1px solid #b9d8b9; }

/* ── Result page ── */
.yhr-hero {
	background: linear-gradient(135deg, var(--brown-d,#3d2c14), #5a3818);
	padding: 48px 24px;
	text-align: center;
	color: #fff;
}
.yhr-for { font-size: 15px; color: rgba(255,255,255,.6); margin-bottom: 6px; }
.yhr-name-en {
	font-family: 'Cormorant Garamond', serif;
	font-size: clamp(30px, 4vw, 48px);
	font-weight: 500;
	margin: 0 0 6px;
}
.yhr-name-he {
	font-family: 'Frank Ruhl Libre', serif;
	font-size: 22px;
	color: rgba(255,255,255,.7);
	direction: rtl;
	margin-bottom: 14px;
}
.yhr-date {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: rgba(255,255,255,.1);
	border: 1px solid rgba(255,255,255,.2);
	border-radius: 20px;
	padding: 6px 18px;
	font-size: 13px;
	color: rgba(255,255,255,.9);
}

.yhr-share-bar {
	background: var(--white,#fffdf8);
	border-bottom: 1px solid var(--cream-d,#e8dfd0);
	padding: 14px 24px;
	display: flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
	justify-content: center;
}
.yhr-share-label { font-size: 12px; color: #aaa; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; }
.yhr-share-url {
	background: var(--cream,#f5f0e8);
	border: 1px solid var(--cream-dp,#ddd0bc);
	border-radius: 6px;
	padding: 6px 12px;
	font-size: 12px;
	color: var(--gold,#9b7d3a);
	font-family: monospace;
	max-width: 300px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.yhr-sp {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 7px 14px;
	border-radius: 20px;
	font-size: 12px;
	font-weight: 600;
	cursor: pointer;
	border: none;
	font-family: inherit;
	text-decoration: none;
	transition: transform .1s;
}
.yhr-sp:hover { transform: translateY(-1px); }
.yhr-sp.wa { background: #25D366; color: #fff; }
.yhr-sp.tw { background: #000; color: #fff; }
.yhr-sp.fb { background: #1877F2; color: #fff; }
.yhr-sp.cp { background: var(--cream-d,#e8dfd0); color: var(--brown,#6b4f2a); }

.yhr-body { max-width: 860px; margin: 0 auto; padding: 36px 24px 64px; }

.yhr-remind-box {
	background: linear-gradient(135deg, #fffaef, #fff5e0);
	border: 1.5px solid var(--gold-l,#c4a55a);
	border-radius: 10px;
	padding: 22px 26px;
	margin-bottom: 28px;
	display: flex;
	align-items: flex-start;
	gap: 16px;
	flex-wrap: wrap;
}
.yhr-remind-box.yhr-remind-set {
	background: var(--cream,#f5f0e8);
	border-color: var(--cream-d,#e8dfd0);
	align-items: center;
	gap: 12px;
}
.yhr-remind-icon { font-size: 30px; flex-shrink: 0; }
.yhr-remind-text { flex: 1; min-width: 200px; }
.yhr-remind-text h3 {
	font-family: 'Cormorant Garamond', serif;
	font-size: 20px;
	color: var(--brown-d,#3d2c14);
	margin: 0 0 4px;
}
.yhr-remind-text p { font-size: 13px; color: var(--text-soft,#6b5a42); margin: 0; line-height: 1.5; }
.yhr-remind-chips { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 10px; align-items: center; }
.yhr-remind-form {
	display: flex;
	flex-direction: column;
	gap: 6px;
	align-self: flex-end;
	flex-shrink: 0;
}
.yhr-remind-form input[type="email"] {
	padding: 9px 12px;
	font-size: 13px;
	border: 1.5px solid var(--cream-dp,#ddd0bc);
	border-radius: 6px;
	font-family: inherit;
	background: var(--cream,#f5f0e8);
	width: 220px;
}
.yhr-remind-form button {
	padding: 10px;
	background: var(--gold,#9b7d3a);
	color: #fff;
	border: none;
	border-radius: 6px;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	font-family: inherit;
}

.yhr-intro-box {
	background: var(--white,#fffdf8);
	border: 1px solid var(--cream-d,#e8dfd0);
	border-radius: 8px;
	padding: 18px 22px;
	margin-bottom: 28px;
	font-size: 14px;
	color: var(--text-soft,#6b5a42);
	line-height: 1.7;
}
.yhr-intro-box p { margin: 0; }
.yhr-letters-display { display: inline-flex; gap: 4px; vertical-align: middle; margin: 0 4px; }

.yhr-section-header {
	display: flex;
	align-items: center;
	gap: 16px;
	margin: 36px 0 16px;
	padding-bottom: 10px;
	border-bottom: 2px solid var(--gold,#9b7d3a);
}
.yhr-section-badge {
	width: 38px;
	height: 38px;
	border-radius: 50%;
	background: var(--gold,#9b7d3a);
	color: #fff;
	font-family: 'Frank Ruhl Libre', serif;
	font-size: 20px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}
.yhr-section-title {
	font-family: 'Cormorant Garamond', serif;
	font-size: 22px;
	color: var(--brown-d,#3d2c14);
	font-weight: 500;
}
.yhr-section-sub { font-size: 13px; color: #aaa; margin-top: 2px; }

.yhr-psalm-block {
	background: var(--white,#fffdf8);
	border: 1px solid var(--cream-d,#e8dfd0);
	border-radius: 8px;
	padding: 18px 22px;
	margin-bottom: 14px;
}
.yhr-psalm-title {
	font-family: 'Cormorant Garamond', serif;
	font-size: 19px;
	color: var(--brown-d,#3d2c14);
	font-weight: 600;
	margin-bottom: 12px;
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
}
.yhr-psalm-letter {
	background: var(--gold,#9b7d3a);
	color: #fff;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 16px;
	font-family: 'Frank Ruhl Libre', serif;
}
.yhr-psalm-range { font-size: 13px; color: #aaa; font-weight: 400; }
.yhr-psalm-link {
	font-size: 12px;
	color: var(--gold,#9b7d3a);
	text-decoration: none;
	margin-left: auto;
}
.yhr-not-imported {
	font-size: 13px;
	color: #aaa;
	font-style: italic;
	padding: 12px 0;
}
.yhr-not-imported a { color: var(--gold,#9b7d3a); }

.yhr-verses { }
.yhr-verse {
	display: grid;
	grid-template-columns: 26px 1fr 1fr;
	gap: 10px 18px;
	padding: 11px 0;
	border-bottom: 1px solid var(--cream-d,#e8dfd0);
	align-items: start;
}
.yhr-verse:last-child { border-bottom: none; }
.yhr-vnum { font-size: 12px; color: #ccc; padding-top: 3px; }
.yhr-vhe {
	font-family: 'Frank Ruhl Libre', serif;
	font-size: 18px;
	direction: rtl;
	text-align: right;
	line-height: 1.65;
	color: var(--brown-d,#3d2c14);
}
.yhr-ven { font-size: 14px; color: var(--text-soft,#6b5a42); line-height: 1.7; }

/* Kaddish */
.yhr-kaddish-tabs { display: flex; gap: 8px; margin-bottom: 16px; flex-wrap: wrap; }
.yhr-kaddish-tab {
	padding: 7px 18px;
	border: 1.5px solid var(--cream-dp,#ddd0bc);
	border-radius: 20px;
	background: #fff;
	color: var(--brown,#6b4f2a);
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	font-family: inherit;
	transition: all .15s;
}
.yhr-kaddish-tab.active {
	background: var(--gold,#9b7d3a);
	color: #fff;
	border-color: var(--gold,#9b7d3a);
}
.kaddish-he {
	font-family: 'Frank Ruhl Libre', serif;
	font-size: 19px;
	direction: rtl;
	text-align: right;
	line-height: 1.7;
	color: var(--brown-d,#3d2c14);
	margin: 0 0 4px;
}
.kaddish-en {
	font-size: 14px;
	color: var(--text-soft,#6b5a42);
	line-height: 1.65;
	margin: 0 0 16px;
	padding-bottom: 16px;
	border-bottom: 1px solid var(--cream-d,#e8dfd0);
}
.kaddish-en:last-child { border-bottom: none; }

.yhr-save-box {
	background: var(--white,#fffdf8);
	border: 1px solid var(--cream-d,#e8dfd0);
	border-radius: 10px;
	padding: 28px;
	margin-top: 36px;
	text-align: center;
}
.yhr-save-box h3 {
	font-family: 'Cormorant Garamond', serif;
	font-size: 24px;
	color: var(--brown-d,#3d2c14);
	margin: 0 0 8px;
}
.yhr-save-box p { font-size: 14px; color: var(--text-soft,#6b5a42); margin: 0 0 18px; }
.yhr-save-btns { display: flex; gap: 10px; justify-content: center; }
.yhr-btn-o {
	padding: 11px 24px;
	border: 1.5px solid var(--gold,#9b7d3a);
	color: var(--gold,#9b7d3a);
	background: transparent;
	border-radius: 6px;
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	transition: all .15s;
}
.yhr-btn-o:hover { background: var(--gold,#9b7d3a); color: #fff; }
.yhr-btn-p {
	padding: 11px 24px;
	background: var(--gold,#9b7d3a);
	color: #fff;
	border: none;
	border-radius: 6px;
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	transition: background .15s;
}
.yhr-btn-p:hover { background: var(--brown,#6b4f2a); }

@media (max-width: 700px) {
	.yh-steps { grid-template-columns: 1fr; gap: 12px; }
	.yh-form-card { padding: 24px 18px; }
	.yh-field-row { grid-template-columns: 1fr; }
	.yhr-verse { grid-template-columns: 22px 1fr; }
	.yhr-ven { grid-column: 2; }
	.yhr-remind-form input[type="email"] { width: 100%; }
	.yhr-save-btns { flex-direction: column; }
}

/* ═══════════════════════════════════════════════════════════
   v0.5.16 — My Tfilah personal area
   ═══════════════════════════════════════════════════════════ */
.my-tfilah-page { min-height: calc(100vh - var(--nav-h,58px)); background: var(--cream,#f5f0e8); }

/* Loading */
.myt-loading { display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:50vh;gap:16px;color:#aaa;font-size:15px; }
.myt-spinner { width:36px;height:36px;border:3px solid var(--cream-d,#e8dfd0);border-top-color:var(--gold,#9b7d3a);border-radius:50%;animation:spin .7s linear infinite; }
@keyframes spin { to { transform:rotate(360deg); } }

/* Auth screen */
.myt-auth { display:flex;align-items:center;justify-content:center;min-height:calc(100vh - 100px);padding:24px; }
.myt-auth-card { background:var(--white,#fffdf8);border-radius:14px;padding:44px 40px;max-width:440px;width:100%;text-align:center;box-shadow:0 12px 40px rgba(0,0,0,.1); }
.myt-auth-logo { font-size:48px;margin-bottom:12px; }
.myt-auth-title { font-family:'Cormorant Garamond',serif;font-size:32px;color:var(--brown-d,#3d2c14);margin:0 0 8px;font-weight:500; }
.myt-auth-sub { font-size:15px;color:var(--soft,#6b5a42);line-height:1.6;margin:0 0 28px; }
.myt-auth-error { background:#fdecea;color:#8b1f1f;border:1px solid #f1c0c0;border-radius:6px;padding:10px 14px;font-size:13px;margin-bottom:16px; }
.myt-google-btn { display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:12px 20px;background:#fff;border:1.5px solid #ddd;border-radius:8px;font-size:15px;font-weight:500;color:#333;text-decoration:none;transition:.15s;margin-bottom:16px; }
.myt-google-btn:hover { border-color:#999;background:#f8f8f8; }
.myt-auth-divider { display:flex;align-items:center;gap:12px;color:#ccc;font-size:13px;margin:4px 0 16px; }
.myt-auth-divider::before,.myt-auth-divider::after { content:'';flex:1;height:1px;background:var(--cream-d,#e8dfd0); }
.myt-magic-form { text-align:left; }
.myt-magic-form label { display:block;font-size:12px;color:#aaa;font-weight:600;text-transform:uppercase;letter-spacing:.5px;margin-bottom:5px; }
.myt-magic-form input { width:100%;padding:11px 14px;font-size:15px;border:1.5px solid var(--cream-dp,#ddd0bc);border-radius:6px;background:var(--cream,#f5f0e8);font-family:inherit;box-sizing:border-box; }
.myt-magic-form input:focus { outline:none;border-color:var(--gold,#9b7d3a); }
.myt-magic-form button { width:100%;padding:12px;background:var(--gold,#9b7d3a);color:#fff;border:none;border-radius:6px;font-size:15px;font-weight:600;cursor:pointer;font-family:inherit;margin-top:8px;transition:.15s; }
.myt-magic-form button:hover { background:var(--brown,#6b4f2a); }
.myt-magic-form button:disabled { opacity:.6;cursor:not-allowed; }
.myt-magic-msg { font-size:13px;padding:10px 12px;border-radius:6px;margin-top:8px; }
.myt-magic-msg.is-success { background:#e8f5e9;color:#2d6a31;border:1px solid #b9d8b9; }
.myt-magic-msg.is-error   { background:#fdecea;color:#8b1f1f;border:1px solid #f1c0c0; }
.myt-auth-fine { font-size:11px;color:#bbb;margin-top:16px; }

/* Layout */
.myt-layout { display:grid;grid-template-columns:240px 1fr;min-height:calc(100vh - 58px); }
.myt-sidebar { background:var(--white,#fffdf8);border-right:1px solid var(--cream-d,#e8dfd0);padding:24px 0; }
.myt-sb-user { display:flex;align-items:center;gap:12px;padding:0 20px 20px;border-bottom:1px solid var(--cream-d,#e8dfd0);margin-bottom:12px; }
.myt-avatar { width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,var(--gold,#9b7d3a),var(--brown,#6b4f2a));display:flex;align-items:center;justify-content:center;color:#fff;font-size:18px;font-weight:600;font-family:'Cormorant Garamond',serif;flex-shrink:0;background-size:cover; }
.myt-username { font-size:14px;font-weight:600;color:var(--brown-d,#3d2c14); }
.myt-useremail { font-size:11px;color:#aaa;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:160px; }
.myt-nav-section { padding:12px 20px 4px;font-size:10px;letter-spacing:2px;text-transform:uppercase;color:#bbb;font-weight:600; }
.myt-nav-btn { display:flex;align-items:center;gap:8px;padding:9px 20px;font-size:13px;color:var(--soft,#6b5a42);cursor:pointer;border:none;background:none;width:100%;text-align:left;font-family:inherit;transition:.15s;border-left:3px solid transparent; }
.myt-nav-btn:hover { background:var(--cream,#f5f0e8);color:var(--brown,#6b4f2a); }
.myt-nav-btn.active { background:#fff8e6;color:var(--brown-d,#3d2c14);border-left-color:var(--gold,#9b7d3a);font-weight:500; }
.myt-badge { background:var(--gold,#9b7d3a);color:#fff;font-size:10px;font-weight:700;padding:2px 7px;border-radius:10px;margin-left:auto; }
.myt-content { padding:32px 36px; }
.myt-section { display:none; } .myt-section.active { display:block; }
.myt-sec-title { font-family:'Cormorant Garamond',serif;font-size:30px;color:var(--brown-d,#3d2c14);margin-bottom:4px;font-weight:500; }
.myt-sec-sub { font-size:14px;color:#aaa;margin-bottom:24px; }
.myt-sec-subtitle { font-family:'Cormorant Garamond',serif;font-size:20px;color:var(--brown-d,#3d2c14);margin:24px 0 12px; }

/* Stats */
.myt-stats { display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:20px; }
.myt-stat-card { background:var(--white,#fffdf8);border:1px solid var(--cream-d,#e8dfd0);border-radius:8px;padding:16px;text-align:center; }
.myt-stat-num { font-family:'Cormorant Garamond',serif;font-size:36px;font-weight:600;color:var(--gold,#9b7d3a);line-height:1;margin-bottom:4px; }
.myt-stat-label { font-size:11px;color:#aaa;text-transform:uppercase;letter-spacing:1px; }

/* Upcoming yahrzeit box */
.myt-upcoming-box { background:linear-gradient(135deg,#fffaef,#fff5e0);border:1.5px solid var(--gold-l,#c4a55a);border-radius:10px;padding:18px 22px;margin-bottom:20px; }

/* Prayer cards */
.myt-prayer-grid { display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px; }
.myt-prayer-card { background:var(--white,#fffdf8);border:1px solid var(--cream-d,#e8dfd0);border-radius:8px;padding:16px;position:relative;transition:.15s; }
.myt-prayer-card:hover { border-color:var(--gold,#9b7d3a);transform:translateY(-1px);box-shadow:0 4px 12px rgba(155,125,58,.1); }
.myt-pc-remove { position:absolute;top:8px;right:8px;background:none;border:none;color:#ccc;cursor:pointer;font-size:13px;transition:.15s;padding:2px; }
.myt-pc-remove:hover { color:#c43; }
.myt-pc-cat { font-size:10px;letter-spacing:1.5px;text-transform:uppercase;color:var(--gold,#9b7d3a);margin-bottom:4px; }
.myt-pc-title { font-family:'Cormorant Garamond',serif;font-size:17px;color:var(--brown-d,#3d2c14);text-decoration:none;display:block;line-height:1.3; }

/* Lists (reminders, history) */
.myt-list { display:flex;flex-direction:column;gap:0; }
.myt-list-row { display:flex;align-items:center;gap:14px;padding:14px 0;border-bottom:1px solid var(--cream-d,#e8dfd0);font-size:13px; }
.myt-list-row:last-child { border-bottom:none; }
.myt-list-title { font-weight:500;color:var(--brown-d,#3d2c14);flex:1; }
.myt-list-sub { font-size:12px;color:#aaa; }
.myt-history-icon { font-size:16px;width:24px;text-align:center; }

/* Memorial cards */
.myt-memorial-list { display:flex;flex-direction:column;gap:12px; }
.myt-memorial-card { background:var(--white,#fffdf8);border:1px solid var(--cream-d,#e8dfd0);border-radius:8px;padding:18px 20px;display:flex;align-items:flex-start;gap:14px; }
.myt-mem-name { font-family:'Cormorant Garamond',serif;font-size:20px;color:var(--brown-d,#3d2c14);font-weight:500; }
.myt-mem-name-he { font-family:'Frank Ruhl Libre',serif;font-size:15px;color:#aaa;direction:rtl; }
.myt-mem-date { font-size:12px;color:#aaa;margin:2px 0 6px; }
.myt-mem-actions { display:flex;gap:6px;flex-shrink:0;flex-wrap:wrap;align-self:center; }

/* Buttons */
.myt-btn-sm { padding:6px 13px;border-radius:6px;font-size:12px;font-weight:600;cursor:pointer;font-family:inherit;border:1.5px solid var(--cream-dp,#ddd0bc);background:#fff;color:var(--brown,#6b4f2a);transition:.15s;text-decoration:none;display:inline-block; }
.myt-btn-sm:hover { border-color:var(--gold,#9b7d3a);color:var(--gold,#9b7d3a); }
.myt-btn-sm.myt-btn-p { background:var(--gold,#9b7d3a);color:#fff;border-color:var(--gold,#9b7d3a); }
.myt-btn-sm.myt-btn-p:hover { background:var(--brown,#6b4f2a); }
.myt-btn-sm.myt-btn-del { color:#c43;border-color:#fcc; }
.myt-btn-sm.myt-btn-del:hover { background:#fdecea;border-color:#f1c0c0; }
.myt-btn-p { background:var(--gold,#9b7d3a);color:#fff;border:none;border-radius:6px;font-size:14px;font-weight:600;padding:10px 22px;cursor:pointer;font-family:inherit;text-decoration:none;display:inline-block;transition:.15s; }
.myt-btn-p:hover { background:var(--brown,#6b4f2a); }
.myt-btn-o { border:1.5px solid var(--gold,#9b7d3a);color:var(--gold,#9b7d3a);background:transparent;border-radius:6px;font-size:14px;font-weight:600;padding:10px 22px;cursor:pointer;font-family:inherit;text-decoration:none;display:inline-block;transition:.15s; }
.myt-btn-o:hover { background:var(--gold,#9b7d3a);color:#fff; }
.myt-action-link { color:var(--gold,#9b7d3a);font-size:14px;font-weight:600;text-decoration:none; }
.myt-action-link:hover { text-decoration:underline; }

/* Empty state */
.myt-empty { text-align:center;padding:56px 24px;color:#aaa; }
.myt-empty-icon { font-size:44px;margin-bottom:10px; }
.myt-empty h3 { font-family:'Cormorant Garamond',serif;font-size:22px;color:var(--soft,#6b5a42);margin-bottom:6px; }
.myt-empty p { font-size:14px; }

@media (max-width:720px) {
	.myt-layout { grid-template-columns:1fr; }
	.myt-sidebar { border-right:none;border-bottom:1px solid var(--cream-d,#e8dfd0); }
	.myt-content { padding:20px 16px; }
	.myt-stats { grid-template-columns:repeat(3,1fr); }
	.myt-memorial-card { flex-wrap:wrap; }
}

/* ═══════════════════════════════════════════════════════════
   v0.5.17 — Save prayer button + nav My Tfilah
   ═══════════════════════════════════════════════════════════ */
.save-prayer-wrap {
	display: none; /* shown via JS when logged in */
	margin-top: 16px;
}
.save-prayer-btn {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 9px 20px;
	border: 1.5px solid var(--cream-dp, #ddd0bc);
	border-radius: 20px;
	background: #fff;
	color: var(--brown, #6b4f2a);
	font-size: 14px;
	font-weight: 500;
	cursor: pointer;
	font-family: inherit;
	transition: all .15s;
}
.save-prayer-btn:hover {
	border-color: var(--gold, #9b7d3a);
	color: var(--gold, #9b7d3a);
}
.save-prayer-icon { font-size: 16px; }

/* My Tfilah nav link */
.nav-my-link {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	border: 1.5px solid var(--cream-d, #e8dfd0);
	color: var(--brown, #6b4f2a) !important;
	font-weight: 500;
	border-radius: 6px;
}
.nav-my-link:hover {
	border-color: var(--gold, #9b7d3a);
	background: #fffaef !important;
}

/* ═══════════════════════════════════════════════════════════
   v0.5.17 — Save prayer button + nav My Tfilah link
   ═══════════════════════════════════════════════════════════ */
.save-prayer-wrap {
	display: inline-block;
	margin-left: 10px;
	vertical-align: middle;
}
.save-prayer-btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 9px 18px;
	border: 1.5px solid var(--cream-dp, #ddd0bc);
	border-radius: 20px;
	background: #fff;
	color: var(--brown, #6b4f2a);
	font-size: 13px;
	font-weight: 500;
	cursor: pointer;
	font-family: inherit;
	transition: all .15s;
}
.save-prayer-btn:hover {
	border-color: var(--gold, #9b7d3a);
	color: var(--gold, #9b7d3a);
}
.save-prayer-btn[data-saved="1"] {
	background: #fff8e6;
	border-color: var(--gold, #9b7d3a);
	color: var(--gold, #9b7d3a);
}
.save-prayer-icon { font-size: 15px; }

/* My Tfilah nav link */
.nav-my-link {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	border: 1.5px solid var(--cream-d, #e8dfd0) !important;
	border-radius: 20px !important;
	padding: 5px 14px !important;
	font-weight: 500;
}
.nav-my-link:hover {
	border-color: var(--gold, #9b7d3a) !important;
	background: #fffaef !important;
}

/* ═══════════════════════════════════════════════════════════
   Save prayer button
   ═══════════════════════════════════════════════════════════ */
.save-prayer-wrap { display: inline-block; }
.save-prayer-btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 16px;
	border: 1.5px solid var(--cream-dp, #ddd0bc);
	border-radius: 20px;
	background: #fff;
	color: var(--brown, #6b4f2a);
	font-size: 13px;
	font-weight: 500;
	cursor: pointer;
	font-family: inherit;
	transition: all .15s;
	position: relative;
}
.save-prayer-btn:hover {
	border-color: var(--gold, #9b7d3a);
	color: var(--gold, #9b7d3a);
}
.save-prayer-btn:disabled { opacity: .5; cursor: not-allowed; }
.save-prayer-icon { font-size: 15px; line-height: 1; }

/* ═══════════════════════════════════════════════════════════
   v0.5.17 — Homepage Yahrzeit CTA + Save prayer button
   ═══════════════════════════════════════════════════════════ */

/* Yahrzeit CTA strip */
.hp-yahrzeit-cta {
	background: linear-gradient(135deg, #3d2c14, #5a3818);
	padding: 32px 24px;
	margin: 0;
}
.hp-yh-inner {
	max-width: 1100px;
	margin: 0 auto;
	display: flex;
	align-items: center;
	gap: 20px;
	flex-wrap: wrap;
}
.hp-yh-icon { font-size: 36px; flex-shrink: 0; }
.hp-yh-text { flex: 1; min-width: 220px; }
.hp-yh-text h2 {
	font-family: var(--font-display, serif);
	font-size: 22px;
	color: #fff;
	font-weight: 500;
	margin: 0 0 6px;
}
.hp-yh-text h2 em { font-style: italic; color: #f5d98a; }
.hp-yh-text p {
	font-size: 14px;
	color: rgba(255,255,255,.75);
	margin: 0;
	line-height: 1.5;
	max-width: 560px;
}
.hp-yh-btn {
	display: inline-block;
	background: rgba(255,255,255,.12);
	border: 1.5px solid rgba(255,255,255,.35);
	color: #fff;
	text-decoration: none;
	padding: 12px 24px;
	border-radius: 6px;
	font-size: 14px;
	font-weight: 600;
	white-space: nowrap;
	transition: background .15s;
	flex-shrink: 0;
}
.hp-yh-btn:hover { background: rgba(255,255,255,.22); }

@media (max-width: 600px) {
	.hp-yh-inner { justify-content: center; text-align: center; }
	.hp-yh-text p { max-width: none; }
}

/* Save prayer button */
.save-prayer-wrap { display: inline-block; margin-top: 8px; }
.save-prayer-btn {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 9px 20px;
	border: 1.5px solid var(--cream-dp, #ddd0bc);
	background: var(--white, #fffdf8);
	color: var(--brown, #6b4f2a);
	border-radius: 20px;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	font-family: inherit;
	transition: all .15s;
}
.save-prayer-btn:hover {
	border-color: var(--gold, #9b7d3a);
	color: var(--gold, #9b7d3a);
	background: #fffaef;
}
.save-prayer-btn.saved {
	background: var(--gold, #9b7d3a);
	color: #fff;
	border-color: var(--gold, #9b7d3a);
}
.save-prayer-btn:disabled { opacity: .6; cursor: not-allowed; }
.save-prayer-icon { font-size: 16px; line-height: 1; }

.yh-prev-note {
	font-size: 11px;
	color: #aaa;
	font-style: italic;
	display: block;
	margin-top: 4px;
	width: 100%;
}

/* ── Nav auth button ── */
.nav-my-link {
	display: inline-flex;
	align-items: center;
	gap: 0;
	padding: 6px 14px;
	border: 1.5px solid var(--cream-dark, #ddd0bc);
	border-radius: 20px;
	font-size: 13px;
	font-weight: 500;
	color: var(--brown, #6b4f2a) !important;
	text-decoration: none;
	transition: border-color .15s, background .15s;
	white-space: nowrap;
}
.nav-my-link:hover {
	border-color: var(--gold, #9b7d3a);
	background: #fffaef;
	color: var(--brown-dark, #3d2c14) !important;
}
.nav-my-avatar {
	display: none;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: var(--gold, #9b7d3a);
	color: #fff;
	font-size: 11px;
	font-weight: 700;
	margin-right: 7px;
	flex-shrink: 0;
	overflow: hidden;
}

/* ── Prayer occasion info bar (Option D) ── */
.prayer-when-bar {
	border-top: 1px solid var(--cream-dark, #e0d8c4);
	border-bottom: 1px solid var(--cream-dark, #e0d8c4);
	background: var(--cream, #f5f0e8);
	padding: 14px 0;
}
.prayer-when-bar .container {
	max-width: var(--content-width, 760px);
	margin: 0 auto;
	padding: 0 var(--gutter, 24px);
}
.when-bar-inner {
	display: flex;
	align-items: center;
	gap: 32px;
	flex-wrap: wrap;
}
.when-item {
	display: flex;
	align-items: center;
	gap: 10px;
}
.when-icon {
	font-size: 22px;
	line-height: 1;
	flex-shrink: 0;
}
.when-label {
	font-size: 10px;
	text-transform: uppercase;
	letter-spacing: 1.5px;
	color: var(--text-soft, #6b5a42);
	font-weight: 600;
	line-height: 1;
	margin-bottom: 3px;
}
.when-value {
	font-size: 14px;
	color: var(--brown-dark, #3d2c14);
	font-weight: 500;
	line-height: 1.3;
}

@media (max-width: 600px) {
	.when-bar-inner {
		gap: 16px;
	}
	.when-item {
		flex: 1;
		min-width: calc(50% - 8px);
	}
}

/* ── Push notification bell button ── */
.nav-bell-btn {
	background: none;
	border: 1.5px solid rgba(255,255,255,.35);
	border-radius: 6px;
	color: rgba(255,255,255,.85);
	padding: 5px 10px;
	font-size: 16px;
	cursor: pointer;
	line-height: 1;
	transition: .15s;
}
.nav-bell-btn:hover { background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.6); }

/* ── When-bar share buttons ── */
.when-share { flex-shrink: 0; }
.when-share-btns {
	display: flex;
	gap: 8px;
	align-items: center;
	margin-top: 3px;
}
.when-share-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background: rgba(0,0,0,.06);
	transition: background .15s, transform .15s;
	text-decoration: none;
}
.when-share-btn:hover {
	background: rgba(0,0,0,.14);
	transform: scale(1.1);
}

/* ── Nav search ── */
.nav-search-btn {
	background: none;
	border: none;
	color: rgba(255,255,255,.8);
	cursor: pointer;
	padding: 4px 6px;
	line-height: 1;
	display: flex;
	align-items: center;
}
.nav-search-btn:hover { color: #fff; }

.nav-search-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	background: var(--brown-dark, #3d2c14);
	padding: 16px 24px 20px;
	z-index: 1000;
	box-shadow: 0 8px 24px rgba(0,0,0,.3);
}
.nav-search-form {
	display: flex;
	align-items: center;
	gap: 8px;
	max-width: 640px;
	margin: 0 auto;
}
.nav-search-input {
	flex: 1;
	background: rgba(255,255,255,.1);
	border: 1px solid rgba(255,255,255,.25);
	border-radius: 6px;
	color: #fff;
	font-family: inherit;
	font-size: 16px;
	padding: 10px 14px;
	outline: none;
}
.nav-search-input::placeholder { color: rgba(255,255,255,.5); }
.nav-search-input:focus { border-color: var(--gold, #9b7d3a); }
.nav-search-submit {
	background: var(--gold, #9b7d3a);
	border: none;
	border-radius: 6px;
	color: #fff;
	cursor: pointer;
	padding: 10px 14px;
	display: flex;
	align-items: center;
}
.nav-search-close {
	background: none;
	border: none;
	color: rgba(255,255,255,.6);
	cursor: pointer;
	font-size: 18px;
	padding: 4px 8px;
}
.nav-search-close:hover { color: #fff; }

/* Upcoming prayers in search overlay */
.nav-upcoming {
	max-width: 640px;
	margin: 14px auto 0;
	border-top: 1px solid rgba(255,255,255,.1);
	padding-top: 12px;
}
.nav-upcoming-label {
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: rgba(255,255,255,.5);
	margin-bottom: 8px;
}
.nav-upcoming-item {
	display: flex;
	align-items: baseline;
	gap: 10px;
	padding: 6px 0;
	border-bottom: 1px solid rgba(255,255,255,.07);
	text-decoration: none;
}
.nav-upcoming-item:hover .nav-upcoming-title { color: var(--gold-light, #c4a55a); }
.nav-upcoming-when {
	font-size: 11px;
	color: var(--gold, #9b7d3a);
	flex-shrink: 0;
	min-width: 120px;
}
.nav-upcoming-title {
	font-size: 14px;
	color: rgba(255,255,255,.85);
	line-height: 1.4;
}

/* Site header needs position:relative for overlay */
.site-header { position: relative; }

/* Breadcrumb in category */
.cat-header .breadcrumb a { color: var(--gold); }
.cat-header .breadcrumb span { color: var(--brown); }

/* ════════════════════════════════════════════
   Upcoming prayers — homepage section
════════════════════════════════════════════ */
.hp-upcoming {
	background: var(--white);
	border-top: 1px solid var(--line);
	border-bottom: 1px solid var(--line);
	padding: 60px 0;
}
.hp-upcoming-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 18px;
}
.hp-up-card {
	background: var(--parchment);
	border: 1px solid var(--line);
	padding: 24px 22px 20px;
	text-decoration: none;
	display: block;
	color: var(--brown-dark);
	transition: border-color .15s;
}
.hp-up-card:hover { border-color: var(--gold); color: var(--brown-dark); }
.hp-up-card--urgent { background: #fff9f7; border-color: #e0c0b0; }
.hp-up-when {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .8px;
	text-transform: uppercase;
	color: var(--gold);
	margin-bottom: 8px;
	display: flex;
	align-items: center;
	gap: 6px;
}
.hp-up-when--urgent { color: #a83020; }
.hp-up-dot {
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--gold);
	flex-shrink: 0;
}
.hp-up-dot--urgent { background: #a83020; }
.hp-up-hdate { font-weight: 400; opacity: .75; }
.hp-up-title {
	font-family: var(--font-display);
	font-size: 18px;
	font-weight: 500;
	color: var(--brown-dark);
	line-height: 1.3;
	margin: 0 0 14px;
}
.hp-up-link {
	font-size: 12px;
	color: var(--gold);
}
.hp-up-link::after { content: ' →'; }

@media (max-width: 720px) {
	.hp-upcoming-grid { grid-template-columns: 1fr; gap: 12px; }
	.hp-upcoming { padding: 40px 0; }
}

/* ════════════════════════════════════════════
   Upcoming prayers — mobile strip
════════════════════════════════════════════ */
.mob-upcoming-strip {
	background: var(--cream);
	border-bottom: 1px solid var(--line);
	display: none; /* only on mobile */
}
@media (max-width: 768px) {
	.mob-upcoming-strip { display: block; }
}
.mob-upcoming-inner {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 8px 16px;
}
.mob-upcoming-label {
	font-size: 10px;
	font-weight: 700;
	letter-spacing: .7px;
	text-transform: uppercase;
	color: var(--gold);
	display: flex;
	align-items: center;
	gap: 5px;
	flex-shrink: 0;
}
.mob-upcoming-scroll {
	display: flex;
	gap: 8px;
	overflow-x: auto;
	flex: 1;
	scrollbar-width: none;
	-ms-overflow-style: none;
	padding: 2px 0;
}
.mob-upcoming-scroll::-webkit-scrollbar { display: none; }
.mob-up-chip {
	background: var(--white);
	border: 1px solid var(--line);
	border-radius: 6px;
	padding: 6px 10px;
	flex-shrink: 0;
	min-width: 130px;
	max-width: 160px;
	text-decoration: none;
	display: block;
}
.mob-up-chip--urgent { border-color: #e0c0b0; background: #fff9f7; }
.mob-up-chip-when {
	font-size: 9px;
	font-weight: 700;
	letter-spacing: .6px;
	text-transform: uppercase;
	color: var(--gold);
	display: block;
	margin-bottom: 3px;
}
.mob-up-chip--urgent .mob-up-chip-when { color: #a83020; }
.mob-up-chip-title {
	font-family: var(--font-display);
	font-size: 12px;
	color: var(--brown-dark);
	line-height: 1.35;
	display: block;
}
.mob-upcoming-close {
	background: none;
	border: none;
	color: var(--brown);
	cursor: pointer;
	padding: 4px;
	flex-shrink: 0;
	line-height: 1;
	opacity: .6;
}
.mob-upcoming-close:hover { opacity: 1; }

/* ════════════════════════════════════════════
   Responsive header — tablet & mobile
════════════════════════════════════════════ */

/* Hide mobile controls on desktop */
.nav-mobile-controls { display: none; }

/* ── Tablet (≤ 900px) ── */
@media (max-width: 900px) {
	/* Hide tagline to save space */
	.brand-tagline { display: none !important; }

	/* Show mobile controls */
	.nav-mobile-controls {
		display: flex;
		align-items: center;
		gap: 8px;
		margin-left: auto;
	}

	/* Hide desktop-only nav items */
	.primary-nav .nav-search-btn,
	.primary-nav .nav-bell-btn,
	.primary-nav .lang-switch {
		display: none;
	}

	/* Nav becomes dropdown */
	.primary-nav {
		position: absolute;
		top: 100%;
		left: 0;
		right: 0;
		background: var(--parchment);
		border-bottom: 1px solid var(--line);
		box-shadow: 0 8px 24px rgba(0,0,0,.12);
		flex-direction: column;
		align-items: flex-start;
		gap: 0;
		display: none;
		z-index: 200;
		padding: 8px 0 12px;
	}
	.primary-nav.nav-open { display: flex; }

	.nav-list {
		flex-direction: column;
		gap: 0;
		width: 100%;
		padding: 0 24px;
	}
	.nav-list li { width: 100%; border-bottom: 1px solid var(--cream-dark); }
	.nav-list li:last-child { border: none; }
	.nav-list a {
		display: block;
		padding: 13px 0;
		font-size: 16px;
		border-bottom: none !important;
	}
	.nav-list .nav-cta a {
		display: inline-block;
		margin: 10px 0 4px;
		padding: 8px 20px;
	}

	/* Auth + lang in dropdown */
	.nav-my-link, .lang-switch {
		display: block;
		padding: 12px 24px;
		border-top: 1px solid var(--cream-dark);
		width: 100%;
		color: var(--brown);
		font-size: 15px;
	}
}

/* ── Hamburger button ── */
.nav-hamburger {
	background: none;
	border: none;
	cursor: pointer;
	padding: 6px 4px;
	display: flex;
	flex-direction: column;
	gap: 5px;
	width: 32px;
}
.nav-hamburger span {
	display: block;
	height: 2px;
	background: var(--brown-dark);
	border-radius: 2px;
	transition: transform .2s, opacity .2s;
}
.nav-hamburger.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-hamburger.is-open span:nth-child(2) { opacity: 0; }
.nav-hamburger.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* Mobile search btn color fix (light background) */
@media (max-width: 900px) {
	.nav-mobile-controls .nav-search-btn { color: var(--brown); }
	.nav-mobile-controls .nav-search-btn:hover { color: var(--brown-dark); }
}

/* ════════════════════════════════════════════
   Nav submenu — Prayers categories
════════════════════════════════════════════ */

/* Desktop: hover dropdown */
.nav-has-sub { position: relative; }
.nav-parent-btn {
	background: none;
	border: none;
	cursor: pointer;
	font-family: inherit;
	font-size: 15px;
	color: var(--brown);
	padding: 0;
	display: flex;
	align-items: center;
	gap: 4px;
}
.nav-parent-btn:hover { color: var(--gold); }
.nav-sub-arrow { font-style: normal; transition: transform .2s; display: inline-block; }
.nav-has-sub:hover .nav-sub-arrow,
.nav-has-sub .nav-parent-btn[aria-expanded="true"] .nav-sub-arrow { transform: rotate(90deg); }

.nav-sub {
	position: absolute;
	top: calc(100% + 10px);
	left: 0;
	background: var(--parchment);
	border: 1px solid var(--line);
	box-shadow: 0 8px 24px rgba(0,0,0,.12);
	min-width: 220px;
	z-index: 300;
	padding: 6px 0;
	list-style: none;
	margin: 0;
}
.nav-sub li { border: none !important; }
.nav-sub a {
	display: block;
	padding: 9px 18px;
	font-size: 14px;
	color: var(--brown);
	border-bottom: none !important;
	white-space: nowrap;
}
.nav-sub a:hover { background: var(--cream); color: var(--gold); }
.nav-sub li:first-child a { border-bottom: 1px solid var(--line) !important; font-weight: 600; }

/* Desktop: show on hover */
@media (min-width: 901px) {
	.nav-sub[hidden] { display: none; }
	.nav-has-sub:hover .nav-sub,
	.nav-has-sub:focus-within .nav-sub { display: block !important; }

	/* Hover bridge.
	   The submenu sits 10px below the trigger, so moving the cursor down
	   used to cross dead space, leave .nav-has-sub, and close the menu.
	   This invisible strip makes the gap part of the hover target. It is
	   wider than the trigger so a slightly diagonal cursor path still lands
	   inside it. */
	.nav-has-sub::after {
		content: "";
		position: absolute;
		top: 100%;
		left: -24px;
		right: -24px;
		height: 16px;
		z-index: 299;
	}
	/* Only live while hovering, so it never blocks clicks on neighbours. */
	.nav-has-sub:not(:hover)::after { display: none; }
}

/* Mobile: accordion style */
@media (max-width: 900px) {
	.nav-parent-btn {
		width: 100%;
		justify-content: space-between;
		padding: 13px 0;
		font-size: 16px;
		border-bottom: 1px solid var(--cream-dark);
	}
	.nav-sub {
		position: static;
		box-shadow: none;
		border: none;
		border-left: 3px solid var(--gold-pale);
		border-radius: 0;
		padding: 4px 0 4px 12px;
		margin: 0 0 4px;
		background: var(--cream);
	}
	.nav-sub[hidden] { display: none; }
	.nav-sub a { padding: 9px 12px; font-size: 14px; }
	.nav-sub li:first-child a { border-bottom: none !important; }
}

/* ── Search inside mobile nav ── */
.nav-mobile-search {
	display: none;
	padding: 12px 24px 16px;
	border-top: 1px solid var(--line);
}
@media (max-width: 900px) {
	.nav-mobile-search { display: block; }
}
.nav-mobile-search form {
	display: flex;
	align-items: center;
	gap: 8px;
	background: var(--white);
	border: 1px solid var(--line);
	border-radius: 6px;
	padding: 4px 4px 4px 12px;
}
.nav-mobile-search-input {
	flex: 1;
	border: none;
	background: transparent;
	font-family: inherit;
	font-size: 14px;
	color: var(--brown-dark);
	outline: none;
	padding: 6px 0;
}
.nav-mobile-search-input::placeholder { color: var(--brown); opacity: .6; }
.nav-mobile-search-btn {
	background: var(--gold);
	border: none;
	border-radius: 4px;
	color: #fff;
	padding: 7px 10px;
	cursor: pointer;
	display: flex;
	align-items: center;
}

/* ════════════════════════════════════════════
   Articles archive — page-articles.php
════════════════════════════════════════════ */
.art-archive-hero {
	background: var(--brown-dark);
	padding: 56px 0 50px;
	text-align: center;
}
.art-archive-eye {
	font-style: italic;
	font-size: 11px;
	color: rgba(255,255,255,.4);
	letter-spacing: 4px;
	text-transform: uppercase;
	display: block;
	margin-bottom: 12px;
}
.art-archive-title {
	font-family: var(--font-display);
	font-size: 40px;
	font-weight: 500;
	color: #fff;
	margin: 0 0 10px;
	letter-spacing: -.3px;
}
.art-archive-title em { color: var(--gold-light); font-style: italic; font-weight: 400; }
.art-archive-sub { font-style: italic; font-size: 15px; color: rgba(255,255,255,.5); margin: 0; }

/* Featured */
.art-featured-wrap { background: var(--parchment); border-bottom: 1px solid var(--line); padding: 36px 0; }
.art-featured-label { font-size: 10px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; color: var(--gold); margin-bottom: 14px; }
.art-featured-card { display: grid; grid-template-columns: 1fr 1.2fr; border: 1px solid var(--line); overflow: hidden; background: var(--white); text-decoration: none; color: inherit; }
.art-featured-card:hover .art-featured-title { color: var(--gold); }
.art-featured-img { min-height: 220px; background-size: cover; background-position: center; }
.art-featured-body { padding: 32px 36px; display: flex; flex-direction: column; justify-content: center; }
.art-featured-title { font-family: var(--font-display); font-size: 24px; font-weight: 500; color: var(--brown-dark); line-height: 1.25; margin: 8px 0 12px; transition: color .15s; }
.art-featured-exc { font-size: 14px; color: var(--brown); line-height: 1.65; margin: 0 0 14px; }
.art-featured-read { font-size: 13px; color: var(--gold); font-weight: 600; }
.art-featured-read::after { content: ' →'; }

/* Filter bar */
.art-filter-bar { background: var(--white); border-bottom: 1px solid var(--line); padding: 0; overflow-x: auto; }
.art-filter-bar .container { display: flex; gap: 0; }
.art-filter-btn { background: none; border: none; border-bottom: 2px solid transparent; padding: 12px 16px; font-size: 13px; color: var(--brown); cursor: pointer; white-space: nowrap; font-family: inherit; }
.art-filter-btn.on { color: var(--gold); border-color: var(--gold); font-weight: 600; }
.art-filter-btn:hover { color: var(--gold); }

/* Grid */
.art-grid-section { background: var(--cream); padding: 36px 0 50px; }
.art-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; }
.art-card { background: var(--white); border: 1px solid var(--line); text-decoration: none; color: inherit; display: flex; flex-direction: column; transition: border-color .15s; }
.art-card:hover { border-color: var(--gold); }
.art-card-img { height: 160px; background-size: cover; background-position: center; background-color: var(--cream-dark); }
.art-card-body { padding: 16px 18px; flex: 1; display: flex; flex-direction: column; }
.art-card-tag { font-size: 10px; font-weight: 700; letter-spacing: .8px; text-transform: uppercase; color: var(--gold); margin-bottom: 6px; }
.art-card-title { font-family: var(--font-display); font-size: 17px; color: var(--brown-dark); line-height: 1.3; margin: 0 0 8px; flex: 1; }
.art-card-exc { font-size: 12px; color: var(--brown); line-height: 1.55; margin: 0 0 10px; }
.art-card-meta { font-size: 11px; color: var(--brown); opacity: .6; }
.art-card-read { font-size: 12px; color: var(--gold); font-weight: 600; margin-top: 10px; display: block; }
.art-card-read::after { content: ' →'; }

@media (max-width: 900px) { .art-grid { grid-template-columns: repeat(2,1fr); } .art-featured-card { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .art-grid { grid-template-columns: 1fr; } }

/* ════════════════════════════════════════════
   Single article — single.php
════════════════════════════════════════════ */
.sart-head { background: var(--brown-dark); padding: 52px 0 44px; text-align: center; }
.sart-head .container { max-width: 760px; }
.sart-cat { font-size: 10px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; color: var(--gold-light); margin-bottom: 12px; }
.sart-title { font-family: var(--font-display); font-size: 32px; font-weight: 500; color: #fff; line-height: 1.2; margin: 0 0 12px; letter-spacing: -.3px; }
.sart-subtitle { font-style: italic; font-size: 15px; color: rgba(255,255,255,.55); margin: 0 0 14px; }
.sart-meta { font-size: 12px; color: rgba(255,255,255,.4); margin-bottom: 16px; }
.sart-share-row { display: flex; gap: 8px; align-items: center; justify-content: center; flex-wrap: wrap; }
.sart-sh { background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.18); color: rgba(255,255,255,.7); border-radius: 4px; padding: 5px 12px; font-size: 11px; text-decoration: none; white-space: nowrap; }
.sart-sh:hover { background: rgba(255,255,255,.2); color: #fff; }
.sart-sh--dark { background: var(--cream); border-color: var(--line); color: var(--brown); }
.sart-sh--dark:hover { background: var(--white); color: var(--brown-dark); }

/* Body layout */
.sart-body-wrap { background: var(--white); }
.sart-body-inner { display: grid; grid-template-columns: 1fr 240px; max-width: 1100px; margin: 0 auto; }

.sart-main { padding: 40px 44px 40px 32px; border-right: 1px solid var(--line); }
.sart-hero-img { height: 280px; background-size: cover; background-position: center; border-radius: 4px; margin-bottom: 32px; }
.sart-content { font-size: 17px; line-height: 1.82; color: var(--brown-dark); }
.sart-content p { margin: 0 0 18px; }
.sart-content h2 { font-family: var(--font-display); font-size: 26px; font-weight: 500; color: var(--brown-dark); margin: 36px 0 12px; }
.sart-content h3 { font-family: var(--font-display); font-size: 22px; font-weight: 500; color: var(--brown-dark); margin: 28px 0 10px; }
.sart-content blockquote { border-left: 3px solid var(--gold); padding: 10px 18px; margin: 24px 0; font-style: italic; color: var(--brown); font-size: 18px; }

.sart-share-bottom { border-top: 1px solid var(--line); margin-top: 32px; padding-top: 20px; }
.sart-share-label { font-size: 11px; font-weight: 700; letter-spacing: .5px; text-transform: uppercase; color: var(--brown); }

/* Sidebar */
.sart-sidebar { background: var(--parchment); border-left: 1px solid var(--line); padding: 28px 20px; }
.sart-sb-block { margin-bottom: 22px; }
.sart-sb-eye { font-size: 9px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; color: var(--gold); margin-bottom: 10px; display: flex; align-items: center; gap: 5px; }
.sart-sb-card { display: block; background: var(--white); border: 1px solid var(--line); padding: 10px 12px; margin-bottom: 7px; text-decoration: none; color: inherit; transition: border-color .15s; }
.sart-sb-card:hover { border-color: var(--gold); }
.sart-sb-card--urgent { border-color: #e0c0b0; background: #fff9f7; }
.sart-sb-tag { font-size: 9px; font-weight: 700; letter-spacing: .8px; text-transform: uppercase; color: var(--gold); margin-bottom: 3px; }
.sart-sb-tag--urgent { color: #a83020; }
.sart-sb-title { font-family: var(--font-display); font-size: 12px; color: var(--brown-dark); line-height: 1.35; }
.sart-sb-sub { font-size: 10px; color: var(--brown); font-style: italic; margin-top: 2px; }
.sart-sb-divider { height: 1px; background: var(--line); margin: 14px 0; }

/* Related + Prayers */
.sart-related { background: var(--cream); border-top: 1px solid var(--line); padding: 44px 0; }
.sart-related .container, .sart-prayers-section .container { max-width: 1100px; }
.sart-section-title { font-family: var(--font-display); font-size: 24px; font-weight: 500; color: var(--brown-dark); margin: 0 0 20px; }
.sart-rel-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; }
.sart-rel-card { background: var(--white); border: 1px solid var(--line); text-decoration: none; color: inherit; display: flex; flex-direction: column; transition: border-color .15s; }
.sart-rel-card:hover { border-color: var(--gold); }
.sart-rel-img { height: 120px; background-size: cover; background-position: center; background-color: var(--cream-dark); }
.sart-rel-body { padding: 14px 16px; flex: 1; display: flex; flex-direction: column; }
.sart-rel-type { font-size: 9px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; color: var(--gold); margin-bottom: 5px; }
.sart-rel-title { font-family: var(--font-display); font-size: 15px; color: var(--brown-dark); line-height: 1.3; margin: 0 0 6px; flex: 1; }
.sart-rel-exc { font-size: 12px; color: var(--brown); line-height: 1.5; }
.sart-rel-read { font-size: 11px; color: var(--gold); font-weight: 600; margin-top: 10px; display: block; }
.sart-rel-read::after { content: ' →'; }

.sart-prayers-section { background: var(--parchment); border-top: 1px solid var(--line); padding: 44px 0; }
.sart-prayers-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; }
.sart-prayers-head a { font-size: 13px; font-style: italic; color: var(--gold); text-decoration: none; border-bottom: 1px solid var(--gold-pale); }
.sart-prayer-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }
.sart-prayer-card { background: var(--white); border: 1px solid var(--line); border-left: 3px solid var(--gold); padding: 14px 16px; text-decoration: none; color: inherit; display: flex; flex-direction: column; transition: border-color .15s; }
.sart-prayer-card:hover { border-left-color: var(--brown); }
.sart-prayer-cat { font-size: 9px; font-weight: 700; letter-spacing: .8px; text-transform: uppercase; color: var(--gold); margin-bottom: 4px; }
.sart-prayer-title { font-family: var(--font-display); font-size: 15px; color: var(--brown-dark); line-height: 1.3; margin: 0 0 5px; flex: 1; }
.sart-prayer-when { font-size: 11px; color: var(--brown); font-style: italic; margin-bottom: 10px; }
.sart-prayer-read { font-size: 12px; color: var(--gold); font-weight: 600; }
.sart-prayer-read::after { content: ' →'; }

@media (max-width: 900px) {
	.sart-body-inner { grid-template-columns: 1fr; }
	.sart-sidebar { border-left: none; border-top: 1px solid var(--line); padding: 24px; }
	.sart-rel-grid, .sart-prayer-grid { grid-template-columns: repeat(2,1fr); }
	.sart-main { padding: 28px 24px; }
}
@media (max-width: 560px) {
	.sart-title { font-size: 24px; }
	.sart-rel-grid, .sart-prayer-grid { grid-template-columns: 1fr; }
}

/* ── Article fallback images ── */
.sart-hero-img--fallback {
	background: linear-gradient(135deg, var(--cream-dark) 0%, var(--gold-pale) 100%);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 72px;
	background-image: none !important;
}
.art-card-img--fallback,
.sart-rel-img--fallback {
	background: linear-gradient(135deg, var(--cream-dark) 0%, var(--gold-pale) 100%);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 40px;
	background-image: none !important;
}

/* ════════════════════════════════════════════
   Top Bar
════════════════════════════════════════════ */
.tfilah-en-topbar {
	width: 100%;
	color: #fff;
	font-size: 13px;
	line-height: 1.4;
	z-index: 200;
}
.topbar-inner {
	max-width: 1200px;
	margin: 0 auto;
	padding: 10px 24px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
}
.topbar-text { flex: 1; }
.topbar-text a, .topbar-cta {
	color: #fff;
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 2px;
}
.topbar-cta { margin-left: 8px; white-space: nowrap; }
.topbar-close {
	background: none;
	border: none;
	color: rgba(255,255,255,.65);
	cursor: pointer;
	font-size: 16px;
	padding: 2px 6px;
	flex-shrink: 0;
	line-height: 1;
}
.topbar-close:hover { color: #fff; }
@media (max-width: 600px) {
	.topbar-inner { padding: 10px 16px; font-size: 12px; }
}

/* ════════════════════════════════════════════
   Psalms — chapter page additions (0.11.0)
════════════════════════════════════════════ */

.psalm-heading {
	font-family: var(--font-display);
	font-size: 20px;
	font-style: italic;
	color: var(--gold);
	margin: 6px 0 4px;
}

.psalm-intro {
	max-width: 720px;
	margin: 0 auto 30px;
	font-size: 16px;
	line-height: 1.75;
	color: var(--brown);
}
.psalm-intro p { margin: 0 0 14px; }
.psalm-when {
	margin: 18px 0 0;
	padding: 12px 16px;
	background: var(--cream);
	border-left: 3px solid var(--gold);
	border-radius: 3px;
	font-size: 15px;
}
.psalm-when-label { font-weight: 600; color: var(--brown-dark); margin-inline-end: 6px; }

/* ── View toggle ── */
.psalm-view-toggle {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	justify-content: center;
	max-width: 720px;
	margin: 0 auto 26px;
}
.psalm-view-btn {
	background: var(--parchment);
	border: 1px solid var(--line);
	border-radius: 999px;
	padding: 7px 16px;
	font-family: inherit;
	font-size: 13px;
	color: var(--brown);
	cursor: pointer;
	transition: background .2s, color .2s, border-color .2s;
}
.psalm-view-btn:hover { border-color: var(--gold); color: var(--gold); }
.psalm-view-btn.is-active {
	background: var(--gold);
	border-color: var(--gold);
	color: #fff;
}

.psalm-verse-tl {
	font-style: italic;
	color: var(--gold);
	font-size: 15px;
	line-height: 1.7;
}

/* ── Three-up view ──
   The base .psalm-verse grid is `36px 1fr 1fr` — three tracks built for
   number | Hebrew | translation. Adding the transliteration as a fourth child
   pushed the translation onto an implicit second row, into the 36px number
   column. Placing all four explicitly fixes that: Hebrew keeps the right-hand
   column at full height, and the two Latin-script lines stack on the left in
   the order they are used — transliteration to pronounce, translation to
   understand. */
.psalm-verses.has-tl[data-view="all"] .psalm-verse {
	column-gap: 24px;
	row-gap: 6px;
}
.psalm-verses.has-tl[data-view="all"] .psalm-verse-num { grid-column: 1; grid-row: 1; }
.psalm-verses.has-tl[data-view="all"] .psalm-verse-tl  { grid-column: 2; grid-row: 1; }
.psalm-verses.has-tl[data-view="all"] .psalm-verse-en  { grid-column: 2; grid-row: 2; }
.psalm-verses.has-tl[data-view="all"] .psalm-verse-he  { grid-column: 3; grid-row: 1 / span 2; }

/* ── Single-language views ──
   Hiding two of the three would leave an empty 1fr track, so collapse to two. */
.psalm-verses[data-view="he"] .psalm-verse-tl,
.psalm-verses[data-view="he"] .psalm-verse-en,
.psalm-verses[data-view="tl"] .psalm-verse-he,
.psalm-verses[data-view="tl"] .psalm-verse-en,
.psalm-verses[data-view="tr"] .psalm-verse-he,
.psalm-verses[data-view="tr"] .psalm-verse-tl { display: none; }

.psalm-verses[data-view="he"] .psalm-verse,
.psalm-verses[data-view="tl"] .psalm-verse,
.psalm-verses[data-view="tr"] .psalm-verse { grid-template-columns: 36px 1fr; }

.psalm-verses[data-view="he"] .psalm-verse-he,
.psalm-verses[data-view="tl"] .psalm-verse-tl,
.psalm-verses[data-view="tr"] .psalm-verse-en { grid-column: 2; grid-row: 1; }

/* ── Mobile ──
   No room for two text columns; everything stacks in DOM order (Hebrew,
   transliteration, translation). These need the same specificity as the
   desktop placement rules above in order to override them. */
@media (max-width: 720px) {
	.psalm-verses.has-tl[data-view="all"] .psalm-verse { grid-template-columns: 30px 1fr; }
	.psalm-verses.has-tl[data-view="all"] .psalm-verse-num { grid-column: 1; grid-row: 1; }
	.psalm-verses.has-tl[data-view="all"] .psalm-verse-he,
	.psalm-verses.has-tl[data-view="all"] .psalm-verse-tl,
	.psalm-verses.has-tl[data-view="all"] .psalm-verse-en {
		grid-column: 2;
		grid-row: auto;
	}
	/* Single-language views: keep the narrower mobile number column. */
	.psalm-verses[data-view="he"] .psalm-verse,
	.psalm-verses[data-view="tl"] .psalm-verse,
	.psalm-verses[data-view="tr"] .psalm-verse { grid-template-columns: 30px 1fr; }
	.psalm-verse-tl { font-size: 14px; }
}

/* ── Q&A (shared by chapter pages and the index) ── */
.psalm-qa {
	max-width: 720px;
	margin: 48px auto 0;
	padding-top: 32px;
	border-top: 1px solid var(--line);
}
.psalm-qa-title {
	font-family: var(--font-display);
	font-size: 26px;
	color: var(--brown-dark);
	margin: 0 0 20px;
}
.psalm-qa-item {
	border-bottom: 1px solid var(--line);
	padding: 4px 0;
}
.psalm-qa-q {
	cursor: pointer;
	list-style: none;
	padding: 14px 28px 14px 0;
	position: relative;
	font-weight: 600;
	font-size: 16px;
	color: var(--brown-dark);
	line-height: 1.45;
}
.psalm-qa-q::-webkit-details-marker { display: none; }
.psalm-qa-q::after {
	content: "+";
	position: absolute;
	inset-inline-end: 4px;
	top: 12px;
	font-size: 20px;
	color: var(--gold);
	transition: transform .2s;
}
.psalm-qa-item[open] .psalm-qa-q::after { content: "\2212"; }
.psalm-qa-q:hover { color: var(--gold); }
.psalm-qa-a {
	padding: 0 0 16px;
	font-size: 15px;
	line-height: 1.75;
	color: var(--brown);
}

/* ════════════════════════════════════════════
   Psalms — index page (0.11.0)
════════════════════════════════════════════ */

.psalms-index-intro {
	max-width: 720px;
	margin: 0 auto 36px;
	font-size: 16.5px;
	line-height: 1.8;
	color: var(--brown);
}
.psalms-index-intro p { margin: 0 0 14px; }

.psalms-entry-cards {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 18px;
	max-width: 860px;
	margin: 0 auto 48px;
}
.psalms-entry-card {
	display: block;
	background: linear-gradient(135deg, #6b4f2a, #9b7d3a);
	color: #f7f0df;
	border-radius: 6px;
	padding: 24px 26px;
	transition: transform .25s ease, box-shadow .25s ease;
}
.psalms-entry-card:hover {
	transform: translateY(-3px);
	box-shadow: 0 12px 28px rgba(107,79,42,.24);
	color: #fff;
}
.psalms-entry-card h3 {
	font-family: var(--font-display);
	font-size: 20px;
	margin: 0 0 8px;
	color: inherit;
}
.psalms-entry-card p { margin: 0; font-size: 14.5px; line-height: 1.6; opacity: .92; }

.psalms-section-title {
	font-family: var(--font-display);
	font-size: 28px;
	color: var(--brown-dark);
	text-align: center;
	margin: 0 0 24px;
}

.psalms-popular {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: 14px;
	max-width: 1000px;
	margin: 0 auto 56px;
}
.psalms-popular-card {
	display: flex;
	align-items: center;
	gap: 14px;
	background: var(--parchment);
	border: 1px solid var(--line);
	border-radius: 4px;
	padding: 14px 16px;
	transition: border-color .2s, transform .2s;
}
.psalms-popular-card:hover { border-color: var(--gold); transform: translateY(-2px); }
.psalms-popular-num {
	font-family: var(--font-display);
	font-size: 26px;
	color: var(--gold);
	min-width: 42px;
	text-align: center;
}
.psalms-popular-body { display: flex; flex-direction: column; }
.psalms-popular-title { font-weight: 600; color: var(--brown-dark); font-size: 15px; }
.psalms-popular-heading { font-size: 13.5px; color: var(--brown); font-style: italic; }

.psalms-book { max-width: 1000px; margin: 0 auto 40px; }
.psalms-book-title {
	font-family: var(--font-display);
	font-size: 21px;
	color: var(--brown-dark);
	border-bottom: 1px solid var(--line);
	padding-bottom: 8px;
	margin: 0 0 14px;
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 12px;
	flex-wrap: wrap;
}
.psalms-book-range { font-size: 13px; font-style: italic; color: var(--gold); font-family: var(--font-body); }

.psalms-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
	gap: 2px 18px;
}
.psalms-list-item a {
	display: flex;
	gap: 10px;
	align-items: baseline;
	padding: 7px 6px;
	border-radius: 3px;
	color: var(--brown);
	font-size: 14.5px;
	transition: background .15s, color .15s;
}
.psalms-list-item a:hover { background: var(--cream); color: var(--gold); }
.psalms-list-num {
	font-weight: 600;
	color: var(--gold);
	min-width: 30px;
	text-align: end;
	font-variant-numeric: tabular-nums;
}
.psalms-list-heading { flex: 1; }

@media (max-width: 760px) {
	.psalms-section-title { font-size: 23px; }
	.psalms-list { grid-template-columns: 1fr; }
	.psalms-popular { grid-template-columns: 1fr; }
	.psalms-entry-cards { grid-template-columns: 1fr; }
	.psalm-heading { font-size: 17px; }
	.psalm-view-toggle { gap: 5px; }
	.psalm-view-btn { padding: 6px 12px; font-size: 12px; }
	.psalm-qa-q { font-size: 15px; }
}

/* ════════════════════════════════════════════
   Psalm page — daily-reading navigation (0.12.1)
════════════════════════════════════════════ */

.psalm-daynav {
	max-width: 720px;
	margin: 0 auto 8px;
	padding: 14px 18px;
	background: var(--parchment);
	border: 1px solid var(--gold-pale);
	border-radius: 6px;
}
.psalm-daynav-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	flex-wrap: wrap;
	padding-bottom: 10px;
	margin-bottom: 12px;
	border-bottom: 1px solid var(--line);
}
.psalm-daynav-day {
	font-size: 13.5px;
	color: var(--gold);
	font-weight: 600;
}
.psalm-daynav-count {
	font-size: 12px;
	color: var(--gold);
	background: var(--cream);
	border-radius: 999px;
	padding: 3px 12px;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}
.psalm-daynav-count.is-done { background: #e6efe2; color: #3f6b34; }
.psalm-daynav-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	flex-wrap: wrap;
}
.psalm-nav-done {
	color: #3f6b34 !important;
	border-color: #b9d3b0 !important;
	cursor: default;
}
/* With the day nav present the global chapter nav is the fallback, not the
   primary action — quieten it so the two don't compete. */
.psalm-quicknav.is-secondary { opacity: .72; font-size: 13px; }
.psalm-quicknav.is-secondary:hover { opacity: 1; }

@media (max-width: 720px) {
	.psalm-daynav { margin-inline: 16px; padding: 12px 14px; }
	.psalm-daynav-row { gap: 6px; }
	.psalm-daynav-row .psalm-nav-btn { padding: 6px 10px; font-size: 12.5px; }
}

/* Standalone "all psalms" link, shown in place of the full chapter nav while
   the daily-reading nav is active — the two used to duplicate each other. */
.psalm-quicknav-solo {
	text-align: center;
	max-width: 720px;
	margin: 0 auto 10px;
}
.psalm-quicknav-solo a {
	font-size: 13px;
	color: var(--brown);
	border-bottom: 1px solid var(--line);
	padding-bottom: 2px;
}
.psalm-quicknav-solo a:hover { color: var(--gold); border-color: var(--gold); }