/* ==========================================================================
   NFCR Post Feed  [nfcr_post_feed]   (0.9.20)
   Cards: topic buttons + 3-column photo cards + More button.
   Wide:  2-column horizontal cards (Press room).
   ========================================================================== */

.nfcr-feed { font-family: var(--nfcr-font); }

/* ---- Topic buttons ---- */
.nfcr-feed .nfcr-feed__filters {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 30px;
}
.nfcr-feed .nfcr-feed__filter {
	box-sizing: border-box;
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 10px 18px;
	border-radius: var(--nfcr-r-pill);
	background: var(--nfcr-white);
	font-size: var(--nfcr-fs-small);
	font-weight: 500;
	line-height: 1.2;
	color: var(--nfcr-text-nav) !important;
	text-decoration: none !important;
	transition: background-color .15s ease, color .15s ease;
}
.nfcr-feed .nfcr-feed__filter:hover { color: var(--nfcr-navy) !important; }
.nfcr-feed .nfcr-feed__filter.is-active {
	background: var(--nfcr-navy);
	font-weight: 600;
	color: #fff !important;
}

/* ---- Grid ---- */
.nfcr-feed .nfcr-feed__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 20px;
}
.nfcr-feed--wide .nfcr-feed__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.nfcr-feed[aria-busy="true"] .nfcr-feed__grid { opacity: .6; }

/* ---- Card ---- */
.nfcr-feed .nfcr-post {
	position: relative; /* the title link covers the whole card */
	display: flex;
	flex-direction: column;
	overflow: hidden;
	border-radius: var(--nfcr-r-card);
	background: var(--nfcr-white);
	box-shadow: var(--nfcr-shadow);
	transition: box-shadow .15s ease;
}
.nfcr-feed .nfcr-post:hover { box-shadow: var(--nfcr-shadow-hover); }

.nfcr-feed .nfcr-post__media {
	position: relative;
	height: 180px;
	overflow: hidden;
	background: var(--nfcr-navy);
}
.nfcr-feed .nfcr-post__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
	filter: saturate(.9);
}
/* soft navy tint over every photo */
.nfcr-feed .nfcr-post__media:has(.nfcr-post__img)::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, var(--nfcr-photo-tint-top), var(--nfcr-photo-tint-bottom));
	pointer-events: none;
}
.nfcr-feed .nfcr-post__badge {
	position: absolute;
	left: 16px;
	bottom: 14px;
	z-index: 1;
	padding: 5px 12px;
	border-radius: var(--nfcr-r-callout);
	background: color-mix(in srgb, var(--nfcr-navy) 85%, transparent);
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
	font-size: var(--nfcr-fs-label);
	font-weight: 600;
	line-height: 1.4;
	color: #fff;
}

/* Podcast tile: navy, orange glow top right, play button, show + episode, level bars */
.nfcr-feed .nfcr-post__media--pod {
	display: flex;
	align-items: flex-end;
	padding: 0 26px 20px;
	background: radial-gradient(circle at 82% 18%, var(--nfcr-accent-glow), transparent 55%), var(--nfcr-navy);
}
.nfcr-feed .nfcr-post__play {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 44px;
	height: 44px;
	margin-right: 12px;
	border-radius: 50%;
	background: var(--nfcr-accent);
	color: #fff;
}
.nfcr-feed .nfcr-post__pod { display: flex; flex-direction: column; min-width: 0; }
.nfcr-feed .nfcr-post__pod-show {
	font-size: var(--nfcr-fs-label);
	font-weight: 700;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	color: var(--nfcr-on-dark-muted);
}
.nfcr-feed .nfcr-post__pod-ep {
	font-size: var(--nfcr-fs-h3-lg);
	font-weight: 700;
	letter-spacing: -.5px;
	line-height: 1.2;
	color: #fff;
}
.nfcr-feed .nfcr-post__bars {
	position: absolute;
	top: 22px;
	right: 22px;
	display: flex;
	align-items: flex-end;
	gap: 4px;
	height: 34px;
}
.nfcr-feed .nfcr-post__bars i { display: block; width: 5px; border-radius: 3px; background: var(--nfcr-bar); }
.nfcr-feed .nfcr-post__bars i:nth-child(1) { height: 12px; background: var(--nfcr-bar-dim); }
.nfcr-feed .nfcr-post__bars i:nth-child(2) { height: 26px; }
.nfcr-feed .nfcr-post__bars i:nth-child(3) { height: 18px; background: var(--nfcr-accent); }
.nfcr-feed .nfcr-post__bars i:nth-child(4) { height: 32px; }
.nfcr-feed .nfcr-post__bars i:nth-child(5) { height: 14px; background: var(--nfcr-bar-dim); }

/* Text */
.nfcr-feed .nfcr-post__body {
	display: flex;
	flex-direction: column;
	flex: 1;
	padding: 22px 26px 26px;
}
.nfcr-feed .nfcr-post__topic {
	margin: 0 0 9px;
	font-size: var(--nfcr-fs-label);
	font-weight: 600;
	line-height: 1.4;
	color: var(--nfcr-orange);
}
.nfcr-feed .nfcr-post__title {
	flex: 1;
	margin: 0;
	padding: 0;
	font-family: var(--nfcr-font);
	font-size: var(--nfcr-fs-h3);
	font-weight: 600;
	line-height: 1.35;
	letter-spacing: -.3px;
	text-transform: none;
	color: var(--nfcr-navy);
}
.nfcr-feed .nfcr-post__title a { color: var(--nfcr-navy) !important; text-decoration: none !important; }
.nfcr-feed .nfcr-post__title a::after { content: ""; position: absolute; inset: 0; z-index: 2; border-radius: inherit; }
.nfcr-feed .nfcr-post:hover .nfcr-post__title a { color: var(--nfcr-orange) !important; } /* colour change only */
.nfcr-feed .nfcr-post__title a:focus-visible { outline: 0; }
.nfcr-feed .nfcr-post:has(.nfcr-post__title a:focus-visible) { outline: var(--nfcr-focus); outline-offset: 3px; }
.nfcr-feed .nfcr-post__meta {
	margin: 16px 0 0;
	font-size: var(--nfcr-fs-meta);
	font-weight: 500;
	line-height: 1.4;
	color: var(--nfcr-text-2);
}

/* ---- Wide card: photo 280px left, text right ---- */
.nfcr-feed .nfcr-post--wide { display: grid; grid-template-columns: 280px minmax(0, 1fr); }
.nfcr-feed .nfcr-post--wide .nfcr-post__media { height: auto; min-height: 180px; }
.nfcr-feed .nfcr-post--wide .nfcr-post__body { padding: 24px 28px; }
.nfcr-feed .nfcr-post--wide .nfcr-post__title { font-size: var(--nfcr-fs-title-sm); line-height: 1.4; }
.nfcr-feed .nfcr-post--wide .nfcr-post__meta { margin-top: 14px; }

/* ---- More button, empty message ---- */
.nfcr-feed .nfcr-feed__more-wrap { display: flex; justify-content: center; margin-top: 40px; }
.nfcr-feed .nfcr-feed__more { background: var(--nfcr-white); }
.nfcr-feed .nfcr-feed__more:hover { background: var(--nfcr-navy); }
.nfcr-feed .nfcr-feed__empty {
	margin: 0;
	padding: 28px 30px;
	border-radius: var(--nfcr-r-card);
	background: var(--nfcr-white);
	font-size: var(--nfcr-fs-body);
	color: var(--nfcr-text);
}

/* ---- Tablet / phone ---- */
@media (max-width: 1024px) {
	.nfcr-feed .nfcr-feed__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.nfcr-feed--wide .nfcr-feed__grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 767px) {
	.nfcr-feed .nfcr-feed__grid,
	.nfcr-feed--wide .nfcr-feed__grid { grid-template-columns: minmax(0, 1fr); }
	.nfcr-feed .nfcr-feed__filters {
		flex-wrap: nowrap;
		margin-right: calc(var(--nfcr-gutter) * -1); /* scrolls sideways to the screen edge */
		padding-right: var(--nfcr-gutter);
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
	}
	.nfcr-feed .nfcr-feed__filters::-webkit-scrollbar { display: none; }
	.nfcr-feed .nfcr-feed__filter { flex-shrink: 0; }
	.nfcr-feed .nfcr-post--wide { grid-template-columns: minmax(0, 1fr); }
	.nfcr-feed .nfcr-post--wide .nfcr-post__media { height: 180px; }
	.nfcr-feed .nfcr-post__body,
	.nfcr-feed .nfcr-post--wide .nfcr-post__body { padding: 20px 22px 22px; }
}
