/*
 * Dini 70 — Research insights.
 * Source design (sharjah.ac.ae "Research Insights"): grey band, two columns
 * (research | awards); each item = 205×150 thumbnail (radius 9), then date,
 * title and a green arrow; green "View All" button. See developer guide §5.7.
 */

.drs {
	background: var(--dini-gray-bg);
	padding-block: clamp(32px, 3.5vw, 48px);
}

.drs-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(24px, 3vw, 48px); align-items: start; }
.drs--solo .drs-grid { grid-template-columns: minmax(0, 1fr); }

.drs-heading {
	margin: 0 0 22px;
	font-size: clamp(26px, 2.5vw, 36px);
	font-weight: 500;
	line-height: 1.25;
}
.dini-rtl .drs-heading { font-weight: 700; }

.drs-list { display: grid; gap: 18px; margin: 0 0 22px; padding: 0; list-style: none; }
.drs--solo .drs-list { grid-template-columns: repeat(auto-fill, minmax(420px, 1fr)); column-gap: 32px; }

.drs-item { display: flex; gap: 16px; color: var(--dini-black); text-decoration: none; }
.drs-thumb {
	flex: 0 0 auto;
	width: clamp(140px, 14vw, 205px);
	aspect-ratio: 205 / 150;
	border-radius: 9px;
	overflow: hidden;
	background: #e4e4e4;
}
.drs-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s ease; }
.drs-item:hover .drs-thumb img { transform: scale(1.06); }

.drs-text { display: flex; flex-direction: column; gap: 6px; min-width: 0; padding-top: 4px; }
.drs-text time { font-size: 12.5px; color: #444; }
.drs-title {
	font-size: 15.5px;
	font-weight: 600;
	line-height: 1.55;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.drs-item:hover .drs-title { color: var(--dini-green-dark); }
.drs-go {
	display: inline-grid;
	place-items: center;
	width: 20px;
	height: 20px;
	margin-top: 4px;
	border-radius: 50%;
	background: var(--dini-green);
	color: var(--dini-black);
}
.drs-go .dini-icon { width: 12px; height: 12px; stroke-width: 2.6; }

@media (max-width: 991px) {
	.drs-grid { grid-template-columns: minmax(0, 1fr); }
	.drs--solo .drs-list { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 480px) {
	.drs-thumb { width: 118px; }
	.drs-title { font-size: 14.5px; }
}