/* Gastronome — news.css
 * Single news article + news archive grid styles.
 */

/* ─── single article ─── */
.gn-single-news .news-article {
	max-width: 760px; margin: 0 auto;
	padding: calc(var(--nav-h) + 60px) var(--page) 80px;
}

.gn-single-news .news-back {
	display: inline-flex; align-items: center; gap: 10px;
	color: rgba(255,255,255,0.5);
	font-family: var(--font-body); font-size: 12px; font-weight: 500;
	letter-spacing: 0.15em; text-transform: uppercase;
	margin-bottom: 56px;
	transition: color 0.4s ease;
}
.gn-single-news .news-back:hover { color: #fff; }
.gn-single-news .news-back svg {
	width: 14px; height: 14px;
	transition: transform 0.3s ease;
}
.gn-single-news .news-back:hover svg { transform: translateX(-4px); }

.gn-single-news .news-meta {
	display: flex; flex-wrap: wrap; gap: 12px; align-items: center;
	font-size: 11px; text-transform: uppercase; letter-spacing: 0.18em;
	color: var(--muted); margin-bottom: 24px;
}
.gn-single-news .news-meta-sep { opacity: 0.4; }

.gn-single-news .news-article-title {
	font-family: var(--font-display);
	font-size: clamp(36px, 5vw, 64px);
	font-weight: 700;
	line-height: 1.05; margin-bottom: 24px;
}
.gn-single-news .news-article-subtitle {
	font-family: var(--font-italic);
	font-size: clamp(18px, 2vw, 22px);
	color: var(--dim); line-height: 1.5;
	margin-bottom: 48px; max-width: 600px;
}

.gn-single-news .news-article-lead {
	margin: 0 calc(var(--page) * -1) 64px;
	overflow: hidden;
	height: 70vh; height: 70svh; max-height: 720px; min-height: 420px;
	position: relative;
}
.gn-single-news .news-article-lead-wrap {
	position: absolute; inset: -10%;
	width: 120%; height: 120%;
	will-change: transform;
}
.gn-single-news .news-article-lead-wrap img {
	width: 100%; height: 100%; display: block;
	object-fit: cover;
}

.gn-single-news .news-article-body {
	font-family: var(--font-body);
	font-size: 17px; line-height: 1.7; color: rgba(255,255,255,0.85);
}
.gn-single-news .news-article-body > * + * { margin-top: 24px; }
.gn-single-news .news-article-body h2 {
	font-family: var(--font-display);
	font-size: clamp(24px, 2.5vw, 32px);
	font-weight: 700;
	margin-top: 48px; margin-bottom: 16px;
}
.gn-single-news .news-article-body h3 {
	font-size: 20px; font-weight: 600;
	margin-top: 36px; margin-bottom: 12px; color: #fff;
}
.gn-single-news .news-article-body p { color: rgba(255,255,255,0.8); }
.gn-single-news .news-article-body a {
	color: #fff; border-bottom: 1px solid rgba(255,255,255,0.3);
	transition: border-color 0.3s ease;
}
.gn-single-news .news-article-body a:hover { border-color: #fff; }
.gn-single-news .news-article-body img {
	margin: 32px calc(var(--page) * -1);
	max-width: calc(100% + var(--page) * 2); width: calc(100% + var(--page) * 2);
}
.gn-single-news .news-article-body blockquote {
	border-left: 2px solid rgba(255,255,255,0.2);
	padding-left: 24px; margin: 36px 0;
	font-family: var(--font-italic);
	font-size: 22px; color: var(--dim); font-style: italic;
}

.gn-single-news .news-article-footer {
	margin-top: 64px; padding-top: 32px;
	border-top: 1px solid var(--faint);
}
.gn-single-news .news-article-cats {
	display: flex; flex-wrap: wrap; gap: 8px;
}
.gn-single-news .news-cat-chip {
	padding: 6px 14px;
	border: 1px solid var(--faint); border-radius: 100px;
	font-size: 11px; font-weight: 500; letter-spacing: 0.08em;
	text-transform: uppercase; color: var(--dim);
	transition: all 0.35s ease;
}
.gn-single-news .news-cat-chip:hover { border-color: rgba(255,255,255,0.3); color: #fff; }

/* related */
.gn-single-news .news-related {
	background: #050505; border-top: 1px solid var(--faint);
	padding: 100px 0;
}
.gn-single-news .news-related-inner {
	max-width: 1440px; margin: 0 auto; padding: 0 var(--page);
}
.gn-single-news .news-related-title {
	font-family: var(--font-display);
	font-size: clamp(24px, 3vw, 36px);
	font-weight: 700;
	line-height: 1.1; margin-bottom: 48px;
}
.gn-single-news .news-related-grid {
	display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 32px;
}
@media (max-width: 1024px) { .gn-single-news .news-related-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px)  { .gn-single-news .news-related-grid { grid-template-columns: 1fr; gap: 40px; } }

/* shared news card (same as homepage) */
.news-card { display: block; }
.news-card-img {
	position: relative; overflow: hidden;
	aspect-ratio: 4/3; margin-bottom: 20px;
}
/* Parallax wrap — slightly oversized so GSAP can yPercent it inside the
 * clipping `.news-card-img` without exposing edges. The img inside owns the
 * hover scale; the wrap owns the scroll-driven parallax. Two transforms,
 * one per layer — they don't fight. */
.news-card-img-wrap {
	position: absolute; inset: -10%;
	width: 120%; height: 120%;
	will-change: transform;
}
.news-card-img-wrap img {
	width: 100%; height: 100%; object-fit: cover;
	filter: brightness(0.85);
	transition: transform 0.8s var(--ease-brand), filter 0.5s ease;
	will-change: transform;
}
.news-card:hover .news-card-img-wrap img { transform: scale(1.04); filter: brightness(1); }
.news-card-img::after {
	content: ''; position: absolute; bottom: 0; left: 0; z-index: 2;
	width: 0; height: 1px; background: #fff;
	transition: width 0.6s var(--ease-brand);
}
.news-card:hover .news-card-img::after { width: 100%; }
.news-card-date {
	font-size: 11px; text-transform: uppercase; letter-spacing: 0.15em;
	color: #555; margin-bottom: 10px; display: block;
}
.news-card-title {
	font-family: var(--font-display);
	font-size: clamp(16px, 1.5vw, 22px);
	font-weight: 700;
	color: #fff; line-height: 1.15;
	transition: color 0.3s ease;
	margin-bottom: 8px;
}
.news-card:hover .news-card-title { color: #999; }
.news-card-excerpt {
	font-size: 14px; color: var(--muted);
	line-height: 1.5; margin-top: 8px;
}

/* ─── archive ─── */
.gn-news-archive { --filter-h: 56px; }
@media (max-width: 1024px) { .gn-news-archive { --filter-h: 50px; } }

.gn-news-archive .page-hero {
	padding: calc(var(--nav-h) + 24px) var(--page) 0;
}
.gn-news-archive .page-hero-inner {
	padding: 48px 0 24px;
	display: flex; align-items: flex-end; justify-content: space-between;
	gap: 32px;
}
.gn-news-archive .page-hero h1 {
	font-family: var(--font-display);
	font-size: clamp(32px, 4vw, 56px);
	font-weight: 700; line-height: 1.05;
}
.gn-news-archive .hero-count {
	font-family: var(--font-body); font-size: 15px; font-weight: 300;
	color: var(--dim); padding-bottom: 6px; white-space: nowrap;
}
.gn-news-archive .page-hero-desc {
	color: var(--muted); font-size: 15px; line-height: 1.6;
	max-width: 640px; padding: 0 0 32px;
}

.gn-news-archive .filter-bar {
	z-index: 900; height: var(--filter-h);
	background: rgba(0, 0, 0, 0.88);
	backdrop-filter: blur(20px) saturate(1.2);
	-webkit-backdrop-filter: blur(20px) saturate(1.2);
	border-bottom: 1px solid var(--faint);
	display: flex; align-items: center;
	padding: 0 var(--page);
}
.gn-news-archive .filter-tags {
	display: flex; gap: 8px; align-items: center;
	overflow-x: auto; scrollbar-width: none;
}
.gn-news-archive .filter-tags::-webkit-scrollbar { display: none; }
.gn-news-archive .filter-tag {
	padding: 7px 18px; font-size: 12px; font-weight: 500;
	letter-spacing: 0.08em; text-transform: uppercase;
	color: var(--dim); background: transparent;
	border: 1px solid var(--faint); border-radius: 100px;
	white-space: nowrap;
	transition: all 0.35s ease;
	font-family: var(--font-body);
}
.gn-news-archive .filter-tag:hover { border-color: rgba(255,255,255,0.25); color: #fff; }
.gn-news-archive .filter-tag.active { background: #fff; color: #000; border-color: #fff; }

.gn-news-archive .news-archive-section { padding: 0px var(--page) 100px; }
.gn-news-archive .news-archive-grid {
	display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 32px;
}
.gn-news-archive .news-card {
	opacity: 0;
	animation: gnNewsCardIn 0.8s var(--ease-brand) forwards;
	animation-delay: var(--reveal-delay, 0s);
}
@media (prefers-reduced-motion: reduce) {
	.gn-news-archive .news-card { opacity: 1; animation: none; }
}
@keyframes gnNewsCardIn {
	from { opacity: 0; transform: translateY(32px); }
	to   { opacity: 1; transform: translateY(0); }
}

.gn-news-archive .news-pagination {
	display: flex; justify-content: center; gap: 8px;
	margin-top: 80px;
}
.gn-news-archive .news-pagination .page-numbers {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 40px; height: 40px; padding: 0 14px;
	border: 1px solid var(--faint); border-radius: 100px;
	font-size: 12px; font-weight: 500; letter-spacing: 0.1em;
	color: var(--dim); transition: all 0.3s ease;
}
.gn-news-archive .news-pagination .page-numbers.current,
.gn-news-archive .news-pagination .page-numbers:hover {
	border-color: #fff; color: #fff;
}
.gn-news-archive .news-pagination .page-numbers.current { background: #fff; color: #000; }

@media (max-width: 1024px) {
	.gn-news-archive .news-archive-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
	.gn-news-archive .news-archive-grid { grid-template-columns: 1fr; gap: 40px; }
}
@media (max-width: 767px) {
	.gn-news-archive .page-hero-inner {
		flex-direction: column; align-items: flex-start;
		gap: 8px; padding: 32px 0 20px;
	}
	.gn-single-news .news-article-lead {
		margin: 0 calc(var(--page) * -1) 40px;
	}
	.gn-single-news .news-article-body img {
		margin: 24px 0;
		max-width: 100%; width: 100%;
	}
}
