/*
 * Uses the site's real Editorial Redesign custom properties (--rpb-navy,
 * --rpb-teal, --rpb-gold, Fraunces/Inter) confirmed live in the homepage's
 * rendered <style> block. Hardcoded fallbacks match those same values in case
 * this shortcode ever runs on a page outside that stylesheet's scope.
 */

.rpb-dl-directory {
	display: flex;
	flex-direction: column;
	gap: 2.5rem;
}

.rpb-dl-section-title {
	font-family: var( --rpb-font-display, 'Fraunces', Georgia, serif );
	color: var( --rpb-navy, #101f3d );
	font-size: 1.5rem;
	margin: 0 0 1rem;
}

.rpb-dl-grid {
	display: grid;
	grid-template-columns: repeat( auto-fill, minmax( 260px, 1fr ) );
	gap: 1.25rem;
}

.rpb-dl-card {
	border: 1px solid rgba( 16, 31, 61, 0.12 );
	border-radius: 12px;
	padding: 1.25rem;
	background: #fff;
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}

.rpb-dl-card-title {
	font-family: var( --rpb-font-body, 'Inter', sans-serif );
	color: var( --rpb-navy, #101f3d );
	font-size: 1.05rem;
	margin: 0;
}

.rpb-dl-card-desc {
	font-family: var( --rpb-font-body, 'Inter', sans-serif );
	color: rgba( 16, 31, 61, 0.7 );
	font-size: 0.9rem;
	margin: 0;
	flex-grow: 1;
}

.rpb-dl-btn {
	display: inline-block;
	margin-top: 0.5rem;
	padding: 0.6rem 1.1rem;
	border-radius: 8px;
	background: var( --rpb-teal, #12a3a0 );
	color: #fff;
	font-family: var( --rpb-font-body, 'Inter', sans-serif );
	font-weight: 600;
	font-size: 0.9rem;
	text-decoration: none;
	text-align: center;
	width: fit-content;
}

.rpb-dl-btn:hover,
.rpb-dl-btn:focus {
	background: var( --rpb-navy, #101f3d );
	color: #fff;
}

.rpb-dl-btn-disabled {
	background: rgba( 16, 31, 61, 0.15 );
	color: rgba( 16, 31, 61, 0.55 );
	cursor: default;
}

.rpb-dl-empty,
.rpb-dl-locked {
	font-family: var( --rpb-font-body, 'Inter', sans-serif );
	color: rgba( 16, 31, 61, 0.6 );
	font-style: italic;
}