/* ===========================
   Topics page enhancements
   =========================== */

/* Color Palette */
:root{
	--brown: #5b4d44;
	--light-brown: #a26733;
	--cream: #FFF8F1;
	--caramel: #D2B48C;
	--black: #000;
	--dark-brown: #8b4b2c;
	--grey: #888;

	/* Added accents */
	--cacao: #6e4b3a;
	--latte: #f4e1c6;
	--honey: #f0c36a;
	--warm-tan: #f2d3b1;
	--ink: #2e241c;
	--muted: #6a594c;
	--ring: rgba(0,0,0,.06);
}

.topics-hero{
	text-align:center;
	padding:1.75rem 1rem .5rem;
}
.topics-hero h1{ margin:.1rem 0; }
.topics-meta{
	text-align:center;
	margin-bottom:1.25rem;
	color:var(--muted);
	font-weight:600;
	font-size:.98rem;
}

.topics-grid{
	display:grid;
	grid-template-columns:repeat(12,1fr);
	gap:1.25rem;
	max-width:1100px;
	margin:0 auto 3rem;
	padding:0 1rem;
}
.topic-card{
	grid-column:span 12; /* full width always */
	border-radius:14px;
	border:1px solid var(--ring);
	box-shadow:0 8px 20px rgba(0,0,0,.06);
	overflow:hidden;
	position:relative;
	isolation:isolate;
}

.card-inner{
	display:grid;
	grid-template-columns: 1fr;
	gap:1rem;
	padding:1.2rem;
}
@media (min-width:720px){
	.card-inner{
		grid-template-columns: minmax(0,1fr) 180px;
		align-items:center;
	}
}

.topic-title{
	font-size:1.3rem;
	font-weight:800;
	margin:0 0 .35rem;
	line-height:1.2;
}
.topic-presenter{
	font-weight:700;
	margin-bottom:.35rem;
}
.topic-desc{
	line-height:1.5;
	margin:0;
}

.bio-pics{
	width:160px;
	height:160px;
	object-fit:cover;
	border-radius:14px;
	box-shadow:0 6px 16px rgba(0,0,0,.18);
	border:3px solid rgba(255,255,255,.65);
	justify-self:center;
	background:#eee;
}
@media (max-width:719px){
	.bio-pics{ width:130px; height:130px; }
}

/* Color themes */
.theme-cream{
	background: linear-gradient(180deg, var(--cream), var(--latte));
	color: var(--ink);
}
.theme-cream .topic-title{ color: var(--brown); }
.theme-cream .topic-presenter{ color: var(--dark-brown); }

.theme-caramel{
	background: linear-gradient(180deg, #f9e8d2, var(--caramel));
	color:#2b2119;
}
.theme-caramel .topic-title{ color:#3a2b22; }
.theme-caramel .topic-presenter{ color:#5a3e2b; }

.theme-lightbrown{
	background: linear-gradient(180deg, #ffefe1, #e5c4a2);
	color:#2e1f16;
}
.theme-lightbrown .topic-title{ color:#4b2f1f; }
.theme-lightbrown .topic-presenter{ color:#6a3f27; }

.theme-warmtan{
	background: linear-gradient(180deg, var(--cream), var(--warm-tan));
	color:#2b2119;
}
.theme-warmtan .topic-title{ color:#3a2b22; }
.theme-warmtan .topic-presenter{ color:#5a3e2b; }

.topic-card::before{
	content:"";
	position:absolute;
	inset:0 0 auto 0;
	height:6px;
	background:linear-gradient(90deg,var(--dark-brown),var(--light-brown),var(--honey),var(--cacao));
	opacity:.8;
	mix-blend: multiply;
}