/* TempleSetu Community Hub — Frontend Styles
   Brand: terracotta #C26148, cream/ivory backgrounds, Cinzel headings + clean sans body */

.tsch-wrap,
.tsch-community-landing,
.tsch-hub-grid,
.tsch-single-discourse,
.tsch-single-youth {
	--tsch-accent: #C26148;
	--tsch-accent-rgb: 194, 97, 72;
	--tsch-cream: #FBF4EC;
	--tsch-ivory: #FFFDF9;
	--tsch-gold: #C9A24B;
	--tsch-text: #2E2420;
	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	color: var(--tsch-text);
}

.tsch-wrap { max-width: 1100px; margin: 0 auto; padding: 2rem 1.25rem; }

h1, h2, h3,
.tsch-hero-title,
.tsch-card-title {
	font-family: 'Cinzel', Georgia, serif;
}

.tsch-page-header { text-align: center; margin-bottom: 2rem; }
.tsch-tagline { color: var(--tsch-accent); font-style: italic; }

/* Hub grid / community cards */
.tsch-hub-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: 1.5rem;
}
.tsch-card {
	background: var(--tsch-cream);
	border: 1px solid rgba(var(--tsch-accent-rgb), 0.2);
	border-radius: 14px;
	padding: 1.75rem 1.5rem;
	text-align: center;
	text-decoration: none;
	color: var(--tsch-text);
	transition: transform 0.2s ease, box-shadow 0.2s ease;
	display: flex;
	flex-direction: column;
	align-items: center;
}
.tsch-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 10px 24px rgba(var(--tsch-accent-rgb), 0.18);
	border-color: var(--tsch-accent);
}
.tsch-card-logo img { max-width: 96px; max-height: 96px; border-radius: 50%; object-fit: cover; }
.tsch-card-logo-placeholder {
	width: 72px; height: 72px; border-radius: 50%;
	background: var(--tsch-accent); color: #fff;
	display: flex; align-items: center; justify-content: center;
	font-size: 1.75rem; font-family: 'Cinzel', serif;
}
.tsch-card-title { margin: 1rem 0 0.5rem; color: var(--tsch-accent); font-size: 1.2rem; }
.tsch-card-intro { font-size: 0.9rem; opacity: 0.85; margin-bottom: 0.75rem; }
.tsch-card-link { font-weight: 600; color: var(--tsch-accent); margin-top: auto; }

/* Community landing hero */
.tsch-hero {
	background-color: var(--tsch-accent);
	background-size: cover;
	background-position: center;
	border-radius: 0 0 24px 24px;
	position: relative;
}
.tsch-hero-overlay {
	background: linear-gradient(180deg, rgba(0,0,0,0.35), rgba(0,0,0,0.6));
	color: #fff;
	text-align: center;
	padding: 4rem 1.5rem;
	border-radius: 0 0 24px 24px;
}
.tsch-hero-logo img { width: 96px; height: 96px; border-radius: 50%; border: 3px solid #fff; object-fit: cover; margin-bottom: 1rem; }
.tsch-hero-title { font-size: 2.25rem; margin: 0.25rem 0; }
.tsch-hero-intro { max-width: 640px; margin: 1rem auto; opacity: 0.95; }
.tsch-badge { display: inline-block; padding: 0.25rem 0.85rem; border-radius: 999px; background: var(--tsch-gold); color: #2E2420; font-size: 0.8rem; font-weight: 700; letter-spacing: 0.03em; }
.tsch-cta-button {
	display: inline-block; margin-top: 1.25rem; padding: 0.75rem 1.75rem;
	background: var(--tsch-gold); color: #2E2420; text-decoration: none;
	border-radius: 999px; font-weight: 700;
}
.tsch-cta-button:hover { opacity: 0.9; }

.tsch-section-nav {
	display: flex; justify-content: center; gap: 2rem;
	padding: 1.25rem 0; border-bottom: 1px solid rgba(var(--tsch-accent-rgb), 0.15);
	margin-bottom: 2rem; flex-wrap: wrap;
}
.tsch-section-nav a { color: var(--tsch-accent); text-decoration: none; font-weight: 600; }

.tsch-section { max-width: 1100px; margin: 0 auto 3rem; padding: 0 1.25rem; }
.tsch-section h2 { color: var(--tsch-accent); border-left: 4px solid var(--tsch-accent); padding-left: 0.75rem; }

.tsch-coming-soon {
	background: var(--tsch-cream); border-radius: 12px; padding: 2rem; text-align: center;
	color: var(--tsch-accent); font-style: italic;
}

.tsch-meta-section { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 2rem; }
.tsch-meta-block h3 { color: var(--tsch-accent); }
.tsch-social-link { display: inline-block; margin-right: 0.75rem; color: var(--tsch-accent); text-decoration: none; font-weight: 600; }

/* Discourse grid */
.tsch-discourse-grid, .tsch-youth-grid {
	display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1.5rem;
}
.tsch-discourse-card, .tsch-youth-card {
	background: var(--tsch-ivory); border: 1px solid rgba(var(--tsch-accent-rgb), 0.15);
	border-radius: 12px; overflow: hidden; text-decoration: none; color: var(--tsch-text);
	display: flex; flex-direction: column; transition: box-shadow 0.2s ease;
}
.tsch-discourse-card:hover, .tsch-youth-card:hover { box-shadow: 0 8px 20px rgba(var(--tsch-accent-rgb), 0.2); }
.tsch-discourse-thumb img, .tsch-youth-thumb img { width: 100%; height: 170px; object-fit: cover; }
.tsch-discourse-body, .tsch-youth-body { padding: 1rem 1.25rem; }
.tsch-discourse-body h3, .tsch-youth-body h3 { margin: 0.25rem 0; color: var(--tsch-accent); font-size: 1.1rem; }
.tsch-discourse-speaker { font-size: 0.85rem; opacity: 0.8; margin: 0.25rem 0; }
.tsch-pill {
	display: inline-block; background: rgba(var(--tsch-accent-rgb), 0.12); color: var(--tsch-accent);
	font-size: 0.75rem; padding: 0.15rem 0.6rem; border-radius: 999px; margin: 0.25rem 0.25rem 0.25rem 0;
}
.tsch-discourse-date { font-size: 0.75rem; opacity: 0.6; display: block; margin-top: 0.25rem; }
.tsch-discourse-summary { font-size: 0.85rem; margin-top: 0.5rem; opacity: 0.85; }
.tsch-youth-question { font-style: italic; color: var(--tsch-accent); font-size: 0.9rem; }

/* Single discourse / youth article */
.tsch-breadcrumb { color: var(--tsch-accent); text-decoration: none; font-size: 0.9rem; }
.tsch-discourse-header h1, .tsch-youth-header h1 { color: var(--tsch-accent); margin-top: 0.5rem; }
.tsch-discourse-meta { display: flex; gap: 1rem; flex-wrap: wrap; align-items: center; margin: 1rem 0; }
.tsch-meta-item { display: flex; align-items: center; gap: 0.4rem; font-size: 0.9rem; }
.tsch-meta-item img { width: 32px; height: 32px; border-radius: 50%; object-fit: cover; }

.tsch-video-embed { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; border-radius: 12px; margin: 1.5rem 0; }
.tsch-video-embed iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0; }

.tsch-summary, .tsch-transcripts, .tsch-quotes, .tsch-lessons, .tsch-scriptures,
.tsch-youth-guidance, .tsch-youth-advice, .tsch-youth-actions, .tsch-related-discourses {
	margin: 2rem 0;
}
.tsch-summary h2, .tsch-transcripts h2, .tsch-quotes h2, .tsch-lessons h2, .tsch-scriptures h2,
.tsch-youth-guidance h2, .tsch-youth-advice h2, .tsch-youth-actions h2, .tsch-related-discourses h2 {
	color: var(--tsch-accent);
}

.tsch-transcript-tabs { display: flex; gap: 0.5rem; margin-bottom: 1rem; }
.tsch-tab-btn {
	background: none; border: 1px solid var(--tsch-accent); color: var(--tsch-accent);
	padding: 0.4rem 1rem; border-radius: 999px; cursor: pointer; font-weight: 600;
}
.tsch-tab-btn.active { background: var(--tsch-accent); color: #fff; }

.tsch-quotes ul, .tsch-scriptures ul, .tsch-related-discourses ul { list-style: none; padding: 0; }
.tsch-quotes li { border-left: 3px solid var(--tsch-gold); padding: 0.5rem 1rem; margin-bottom: 0.75rem; font-style: italic; background: var(--tsch-cream); }
.tsch-scriptures li, .tsch-related-discourses li { padding: 0.35rem 0; }

.tsch-checklist { list-style: none; padding: 0; }
.tsch-checklist li { padding: 0.5rem 0 0.5rem 1.75rem; position: relative; }
.tsch-checklist li::before {
	content: "✓"; position: absolute; left: 0; color: var(--tsch-accent); font-weight: 700;
}
.tsch-youth-quote {
	border-left: 4px solid var(--tsch-accent); padding: 1rem 1.5rem; font-size: 1.15rem;
	font-style: italic; background: var(--tsch-cream); margin: 2rem 0;
}
.tsch-youth-question-large { color: var(--tsch-accent); font-style: italic; font-size: 1.1rem; }

.tsch-discourse-actions { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; margin-top: 2rem; }
.tsch-share-buttons a { margin-right: 1rem; color: var(--tsch-accent); text-decoration: none; font-weight: 600; }

.tsch-empty { text-align: center; opacity: 0.7; padding: 2rem 0; }

@media (max-width: 600px) {
	.tsch-hero-overlay { padding: 2.5rem 1rem; }
	.tsch-hero-title { font-size: 1.5rem; }
}