:root {
	--news-yellow: #f4c71f;
	--news-red: #cf2027;
	--news-ink: #080705;
	--news-chocolate: #100b04;
	--news-cream: #f7f1e3;
	--news-muted: rgba(247, 241, 227, 0.72);
	--news-line: rgba(244, 199, 31, 0.22);
	--news-pattern-dark: url("/images/BlackPattern LO.png");
	--news-pattern-gold: url("/images/pattern.png");
	--news-display: "Salter Roman", Georgia, serif;
	--news-body: "Salter Roman", Georgia, serif;
	--news-readable: "Minion Variable Concept", "Minion Pro", Georgia, "Times New Roman", serif;
}

.news-page {
	min-height: calc(100svh - var(--headerHeight, 100px));
	color: var(--news-cream);
	background:
		radial-gradient(circle at 22% 18%, rgba(255, 203, 25, .12), transparent 32rem),
		radial-gradient(circle at 72% 36%, rgba(95, 63, 7, .14), transparent 34rem),
		linear-gradient(180deg, rgba(16, 11, 4, .86), rgba(5, 4, 1, .98)),
		var(--news-pattern-dark) center top / 560px auto repeat,
		var(--news-ink);
	font-family: var(--news-body);
}

.news-hero {
	position: relative;
	overflow: hidden;
	padding: clamp(46px, 5.2vw, 72px) 20px clamp(26px, 3.4vw, 42px);
	isolation: isolate;
}

.news-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background:
		linear-gradient(90deg, rgba(130, 103, 28, 0.84), rgba(88, 70, 22, 0.78)),
		var(--news-pattern-gold) center / 280px auto repeat,
		var(--news-yellow);
	clip-path: polygon(0 0, 100% 0, 100% 72%, 0 100%);
}

.news-hero::after {
	content: none;
	display: none;
}

.news-hero__inner {
	position: relative;
	z-index: 1;
	width: min(100%, 1180px);
	margin: 0 auto;
	color: #070604;
	text-align: center;
}

.news-hero__eyebrow {
	margin: 0 0 12px;
	font-size: clamp(0.78rem, 1vw, 0.95rem);
	font-weight: 800;
	letter-spacing: 0.28em;
	text-transform: uppercase;
}

.news-hero h1 {
	margin: 0;
	color: #070604;
	font-family: var(--news-display);
	font-size: clamp(3.8rem, 9vw, 8rem);
	font-weight: 400;
	line-height: 0.84;
	letter-spacing: 0;
	text-transform: uppercase;
}

.news-feed {
	width: min(100% - 40px, 1220px);
	margin: 0 auto;
	padding: clamp(28px, 4.5vw, 58px) 0 clamp(62px, 8vw, 118px);
}

.news-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: clamp(16px, 2vw, 26px);
	align-items: stretch;
}

.news-card {
	display: grid;
	grid-template-rows: auto 1fr;
	min-width: 0;
	overflow: hidden;
	border: 1px solid var(--news-line);
	border-radius: 8px;
	background: linear-gradient(180deg, rgba(25, 21, 14, 0.96), rgba(9, 8, 6, 0.98));
	box-shadow: 0 22px 48px rgba(0, 0, 0, 0.22);
	color: inherit;
	text-decoration: none;
	transition: transform 220ms ease, border-color 220ms ease, box-shadow 220ms ease;
}

.news-card:hover,
.news-card:focus-visible {
	transform: translateY(-4px);
	border-color: rgba(244, 199, 31, 0.44);
	box-shadow: 0 28px 58px rgba(0, 0, 0, 0.32);
	outline: 0;
}

.news-card__media {
	aspect-ratio: 16 / 10;
	overflow: hidden;
	background: #111;
}

.news-card__media img {
	width: 100%;
	height: 100%;
	display: block;
	object-fit: cover;
	object-position: center;
	transition: transform 0.45s ease;
}

.news-card:hover .news-card__media img {
	transform: scale(1.035);
}

.news-card__body {
	display: grid;
	align-content: start;
	gap: 12px;
	padding: clamp(18px, 2.3vw, 28px);
}

.news-card__kicker {
	margin: 0;
	color: var(--news-yellow);
	font-size: 0.74rem;
	font-weight: 800;
	letter-spacing: 0.24em;
	line-height: 1.2;
	text-transform: uppercase;
}

.news-card h2 {
	margin: 0;
	color: var(--news-cream);
	font-family: var(--news-display);
	font-size: clamp(2rem, 3.2vw, 3.2rem);
	font-weight: 400;
	line-height: 0.95;
	letter-spacing: 0;
}

.news-card__body p:not(.news-card__kicker) {
	margin: 0;
	color: var(--news-muted);
	font-size: clamp(1rem, 1.1vw, 1.12rem);
	line-height: 1.55;
	display: -webkit-box;
	overflow: hidden;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 5;
}

.news-card__read-more {
	align-self: end;
	margin-top: 4px;
	color: var(--news-yellow);
	font-size: clamp(0.88rem, 0.9vw, 1rem);
	letter-spacing: 0.14em;
	line-height: 1.1;
	text-transform: uppercase;
}

.news-empty {
	display: grid;
	min-height: 260px;
	place-items: center;
	border: 1px solid var(--news-line);
	border-radius: 8px;
	background: linear-gradient(180deg, rgba(25, 21, 14, 0.86), rgba(9, 8, 6, 0.94));
	text-align: center;
}

.news-empty p {
	margin: 0;
	color: var(--news-yellow);
	font-family: var(--news-display);
	font-size: clamp(2.4rem, 6vw, 5.2rem);
	line-height: 0.95;
}

@media (max-width: 980px) {
	.news-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 640px) {
	.news-hero {
		padding: 46px 16px 28px;
	}

	.news-hero::before {
		clip-path: polygon(0 0, 100% 0, 100% 84%, 0 100%);
	}

	.news-feed {
		width: min(100% - 28px, 100%);
		padding-top: 28px;
	}

	.news-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 12px;
	}

	.news-card {
		border-radius: 7px;
	}

	.news-card__media {
		aspect-ratio: 1 / 1;
	}

	.news-card__body {
		gap: 8px;
		padding: 12px;
	}

	.news-card__kicker {
		font-size: 0.68rem;
		letter-spacing: 0.14em;
	}

	.news-card h2 {
		font-size: clamp(1.32rem, 8vw, 1.72rem);
		line-height: 0.98;
	}

	.news-card__body p:not(.news-card__kicker) {
		display: none;
	}

	.news-card__read-more {
		font-size: 0.74rem;
		letter-spacing: 0.1em;
	}
}

.news-detail-page {
	position: relative;
	overflow: hidden;
	padding: calc(var(--lo-site-header-height, var(--headerHeight, 76px)) + clamp(38px, 4.4vw, 70px)) 0 clamp(64px, 8vw, 118px);
	background:
		radial-gradient(ellipse 70% 42% at 50% 18%, rgba(250, 194, 10, .13), transparent 68%),
		radial-gradient(circle at 12% 38%, rgba(250, 194, 10, .08), transparent 30rem),
		linear-gradient(180deg, rgba(13, 10, 5, .82), rgba(5, 4, 1, .985)),
		var(--news-pattern-dark) center top / 620px auto repeat,
		var(--news-ink);
}

.news-detail-page::before {
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
	content: "";
	background:
		linear-gradient(90deg, transparent, rgba(250, 194, 10, .055) 50%, transparent),
		linear-gradient(180deg, rgba(250, 194, 10, .035), transparent 26rem);
	mix-blend-mode: screen;
}

.news-article {
	position: relative;
	z-index: 1;
	width: min(100% - 40px, 1180px);
	margin: 0 auto;
}

.news-article__back {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0 0 clamp(22px, 3vw, 36px);
	color: var(--news-yellow);
	font-size: 1rem;
	font-weight: 900;
	letter-spacing: 0.12em;
	text-decoration: none;
	text-transform: uppercase;
	text-shadow: 0 10px 24px rgba(0, 0, 0, .42);
}

.news-article__back::before {
	content: "<";
	font-size: .9em;
	transform: translateY(-1px);
}

.news-article__back:hover,
.news-article__back:focus-visible {
	text-decoration: underline;
	text-underline-offset: 5px;
}

.news-article__header {
	position: relative !important;
	width: min(100%, 980px);
	margin: 0 auto clamp(36px, 4.2vw, 58px) !important;
	padding: clamp(18px, 2.6vw, 34px) clamp(18px, 4vw, 52px) !important;
	height: auto !important;
	min-height: 0 !important;
	overflow: visible !important;
	border: 1px solid rgba(250, 194, 10, .14) !important;
	border-radius: 8px !important;
	background:
		radial-gradient(ellipse 74% 78% at 50% 36%, rgba(250, 194, 10, .10), transparent 72%),
		linear-gradient(180deg, rgba(13, 10, 5, .56), rgba(8, 6, 3, .30)) !important;
	box-shadow:
		0 24px 70px rgba(0, 0, 0, .28),
		inset 0 1px 0 rgba(255, 239, 154, .09) !important;
	text-align: center;
}

.news-article__eyebrow {
	display: none;
	width: 100%;
	margin: 0 0 12px;
	color: var(--news-yellow);
	font-size: clamp(0.82rem, 1vw, 1rem);
	letter-spacing: 0.24em;
	line-height: 1.15;
	text-align: center;
	white-space: nowrap;
	text-transform: uppercase;
}

.news-article__header h1 {
	margin: 0;
	color: var(--news-cream);
	font-family: var(--news-display);
	font-size: clamp(3rem, 5.3vw, 6.2rem);
	font-weight: 400;
	line-height: .9;
	letter-spacing: 0;
	text-align: center;
	text-shadow:
		0 2px 0 rgba(255, 238, 150, .08),
		0 20px 46px rgba(0, 0, 0, .48);
}

.news-article__layout {
	display: grid;
	grid-template-columns: minmax(0, 1.08fr) minmax(300px, 0.92fr);
	grid-template-areas:
		"media meta"
		"body body";
	gap: clamp(18px, 2.8vw, 34px);
	margin-top: clamp(16px, 2vw, 28px);
}

.news-article__media {
	grid-area: media;
	overflow: hidden;
	border: 1px solid rgba(255, 203, 25, .24);
	border-radius: 8px;
	background: rgba(0, 0, 0, 0.32);
	box-shadow:
		0 30px 72px rgba(0, 0, 0, .34),
		0 0 42px rgba(250, 194, 10, .08),
		inset 0 1px 0 rgba(255, 238, 150, .08);
}

.news-article__media img {
	width: 100%;
	aspect-ratio: 16 / 10;
	height: auto;
	display: block;
	object-fit: cover;
	object-position: center;
}

.news-article__meta {
	grid-area: meta;
	align-self: stretch;
	display: grid;
	align-content: center;
	gap: 16px;
	padding: clamp(22px, 3vw, 34px);
	border: 1px solid rgba(255, 203, 25, .18);
	border-radius: 8px;
	background:
		radial-gradient(ellipse 78% 62% at 50% 0%, rgba(255, 203, 25, .095), transparent 22rem),
		linear-gradient(180deg, rgba(24, 17, 7, .62), rgba(8, 6, 3, .82)),
		var(--news-pattern-dark) center / 620px auto repeat;
	box-shadow:
		0 26px 64px rgba(0, 0, 0, .28),
		inset 0 1px 0 rgba(255, 238, 150, .08);
}

.news-article__meta p {
	margin: 0;
	color: var(--news-yellow);
	font-size: 0.9rem;
	letter-spacing: 0.18em;
	text-transform: uppercase;
}

.news-article__meta span {
	display: -webkit-box;
	overflow: hidden;
	color: var(--news-muted);
	font-family: var(--news-readable);
	font-size: clamp(1.08rem, 1.25vw, 1.24rem);
	line-height: 1.46;
	letter-spacing: 0;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 8;
}

.news-article__body {
	grid-area: body;
	width: min(100%, 900px);
	margin: clamp(10px, 2vw, 24px) auto 0;
	padding: clamp(28px, 4vw, 54px);
	border: 1px solid rgba(255, 203, 25, .18);
	border-radius: 8px;
	color: rgba(247, 241, 227, 0.88);
	font-family: var(--news-readable);
	background:
		radial-gradient(ellipse 68% 30% at 50% 0%, rgba(255, 203, 25, .085), transparent 22rem),
		linear-gradient(180deg, rgba(18, 13, 6, .78), rgba(6, 5, 2, .92)),
		var(--news-pattern-dark) center / 620px auto repeat;
	box-shadow:
		0 28px 76px rgba(0, 0, 0, .34),
		inset 0 1px 0 rgba(255, 238, 150, .08);
}

.news-article__body :where(p, li) {
	margin: 0 0 1.15em;
	font-family: var(--news-readable);
	font-size: clamp(1.08rem, 1.16vw, 1.22rem);
	line-height: 1.58;
	letter-spacing: 0;
}

.news-article__body :where(h2, h3, h4) {
	margin: 1.1em 0 0.45em;
	color: var(--news-yellow);
	font-family: var(--news-display);
	font-weight: 400;
	line-height: 1;
}

.news-article__body a {
	color: var(--news-yellow);
	text-decoration: underline;
	text-underline-offset: 4px;
}

@media (max-width: 760px) {
	.news-detail-page {
		padding-top: calc(var(--lo-site-header-height, var(--headerHeight, 72px)) + 28px);
	}

	.news-article {
		width: min(100% - 28px, 100%);
	}

	.news-article__back {
		margin-left: 0;
	}

	.news-article__header {
		padding: 18px 12px !important;
		margin-bottom: 24px !important;
	}

	.news-article__header h1 {
		font-size: clamp(2.55rem, 13vw, 4.2rem);
		line-height: .92;
	}

	.news-article__layout {
		grid-template-columns: 1fr;
		grid-template-areas:
			"media"
			"meta"
			"body";
	}

	.news-article__media img {
		aspect-ratio: 4 / 3;
	}

	.news-article__meta span {
		-webkit-line-clamp: 5;
	}

	.news-article__body {
		padding: 22px 18px;
	}
}

/* Final news detail readability pass: quieter texture, stronger premium surfaces. */
.news-detail-page {
	background:
		radial-gradient(ellipse 74% 42% at 50% 18%, rgba(250, 194, 10, .14), transparent 68%),
		radial-gradient(circle at 50% 58%, rgba(83, 53, 7, .28), transparent 34rem),
		linear-gradient(180deg, rgba(16, 12, 6, .94), rgba(7, 5, 2, .985)),
		var(--news-ink) !important;
}

.news-detail-page::before {
	background:
		linear-gradient(90deg, transparent, rgba(250, 194, 10, .055) 50%, transparent),
		var(--news-pattern-dark) center top / 680px auto repeat !important;
	opacity: .18 !important;
	mix-blend-mode: screen !important;
}

.news-article__header {
	border-color: rgba(250, 194, 10, .18) !important;
	background:
		radial-gradient(ellipse 80% 70% at 50% 48%, rgba(250, 194, 10, .12), transparent 76%),
		linear-gradient(180deg, rgba(18, 13, 6, .70), rgba(8, 6, 3, .58)) !important;
	box-shadow:
		0 28px 74px rgba(0, 0, 0, .34),
		0 0 56px rgba(250, 194, 10, .075),
		inset 0 1px 0 rgba(255, 239, 154, .10) !important;
}

.news-article__media,
.news-article__meta,
.news-article__body {
	border-color: rgba(250, 194, 10, .20) !important;
	background-blend-mode: normal !important;
}

.news-article__meta {
	background:
		radial-gradient(ellipse 74% 44% at 50% 0%, rgba(250, 194, 10, .10), transparent 74%),
		linear-gradient(180deg, rgba(19, 14, 7, .94), rgba(8, 6, 3, .97)) !important;
	box-shadow:
		0 28px 68px rgba(0, 0, 0, .34),
		0 0 42px rgba(250, 194, 10, .055),
		inset 0 1px 0 rgba(255, 239, 154, .09) !important;
}

.news-article__meta span {
	color: rgba(247, 241, 227, .86) !important;
	text-shadow: 0 2px 8px rgba(0, 0, 0, .46) !important;
}

.news-article__body {
	background:
		radial-gradient(ellipse 64% 24% at 50% 0%, rgba(250, 194, 10, .08), transparent 76%),
		linear-gradient(180deg, rgba(18, 13, 6, .95), rgba(7, 5, 2, .98)) !important;
	box-shadow:
		0 30px 76px rgba(0, 0, 0, .34),
		0 0 46px rgba(250, 194, 10, .045),
		inset 0 1px 0 rgba(255, 239, 154, .09) !important;
}

.news-article__body :where(p, li) {
	color: rgba(247, 241, 227, .88) !important;
	font-family: var(--news-readable) !important;
	font-size: clamp(1.1rem, 1.18vw, 1.24rem) !important;
	line-height: 1.64 !important;
	letter-spacing: 0 !important;
	text-shadow: 0 2px 8px rgba(0, 0, 0, .38) !important;
}

.news-article__body :where(strong, b, em, i, a, span),
.news-article__meta span {
	font-family: var(--news-readable) !important;
}
