/* ============================================================
   Videos page — bespoke additions on top of pages.css
   ============================================================ */

/* Card markup uses <span> children inside the <a>; make them block. */
.bu-video { display: flex; flex-direction: column; }
.bu-video__thumb,
.bu-video__body,
.bu-video__title,
.bu-video__meta { display: block; }

/* Featured video: big 16:9 thumb beside a text panel. */
.bu-videos-feature {
	display: grid;
	grid-template-columns: 1.4fr 1fr;
	gap: 40px;
	align-items: stretch;
	text-decoration: none;
	background: var(--bu-panel);
	border: 1px solid var(--bu-border);
	border-radius: var(--bu-radius);
	overflow: hidden;
	transition: box-shadow .2s, border-color .2s, transform .2s;
}
.bu-videos-feature:hover {
	border-color: #E0D2B2;
	box-shadow: 0 30px 60px -34px rgba(18, 43, 63, .4);
}
.bu-videos-feature__thumb {
	position: relative;
	aspect-ratio: 16 / 9;
	background: var(--bu-dark);
	overflow: hidden;
}
.bu-videos-feature__thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: .95;
	transition: transform .35s, opacity .2s;
}
.bu-videos-feature:hover .bu-videos-feature__thumb img { transform: scale(1.04); opacity: 1; }
.bu-videos-feature__thumb .bu-video__play {
	width: 78px;
	height: 78px;
}
.bu-videos-feature__body {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 40px 44px 40px 8px;
}
.bu-videos-feature__title {
	font-family: var(--bu-serif);
	font-weight: 700;
	font-size: clamp(24px, 2.4vw, 32px);
	line-height: 1.14;
	color: var(--bu-navy);
	margin: 12px 0 14px;
}
.bu-videos-feature__text {
	font-size: 16.5px;
	line-height: 1.62;
	color: var(--bu-ink-3);
	margin-bottom: 24px;
}
.bu-videos-feature .bu-more { margin-top: auto; }

/* Two-up video grid (larger cards for short series). */
.bu-videos--2 { grid-template-columns: repeat(2, 1fr); }

@media (max-width: 900px) {
	.bu-videos-feature { grid-template-columns: 1fr; }
	.bu-videos-feature__body { padding: 28px 30px 34px; }
}
@media (max-width: 640px) {
	.bu-videos--2 { grid-template-columns: 1fr; }
}
