/* ==========================================================================
   Jetour — News area, view key "news" (also loaded by the "news-single" and
   "blog-single" views, see inc/integrations.php):
     · page-templates/news.php   <main class="jt-news">          the listing (#453)
     · single-news.php / single-blog.php  <main class="jt-news-single">  one post
   Ported from Elementor templates #453/#135 (listing + card) and #1348/#467
   (single + sidebar card): grey bands, 280px cover cards with a white text
   plate, a 65/35 two-column single with a 1px divider and a sticky sidebar.
   The card component itself is global (.jt-news-card in components.css) —
   only the values that differ here are overridden, always scoped to the view.
   Tokens from base.css. Breakpoints: mobile ≤767 · tablet 768–1024.
   ========================================================================== */

/* ------------------------------------------------------------------ *
 * 1. Listing band — full width, #F0F0F0, padding 120/40/50/40 in the source;
 *    the header spacer already reserves the 65px bar, so 55px remain on top.
 * ------------------------------------------------------------------ */
.jt-news__band {
	background: var(--jt-bg-muted);
	padding: 55px var(--jt-gutter) 50px;
}
.jt-news__heading {
	margin: 0 0 25px;                   /* 5px heading margin + the 20px stack gap */
	font-family: var(--jt-font-display);
	font-weight: 900;
	font-size: var(--jt-h2-sm);         /* 32px / 42px */
	line-height: var(--jt-h2-sm-lh);
	color: var(--jt-black);
	/* no text-transform: Georgian Mkhedruli would be mapped to Mtavruli glyphs */
}
.jt-news__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 50px 20px;                     /* 20px grid gap + 30px item margin in the source */
}
.jt-news__empty { margin: 0; }

/* Card (#135): no card background — the grid grey shows around the white text plate */
.jt-news .jt-news-card { background: transparent; height: auto; }
.jt-news .jt-news-card__media { aspect-ratio: auto; height: 280px; }
.jt-news .jt-news-card__img { transition: transform .3s ease; } /* 0.3s as in the source (component default: .5s) */
.jt-news .jt-news-card__body { gap: 10px; padding: 20px 30px 0 0; background: #fff; }
.jt-news .jt-news-card__title { font-size: 18px; font-weight: 600; line-height: 20px; color: var(--jt-black); }
.jt-news .jt-news-card__date { font-size: 14px; font-weight: 500; line-height: 20px; color: var(--jt-ink); }
.jt-news .jt-news-card:hover .jt-news-card__date { color: var(--jt-teal); }

/* Pagination (global .jt-pagination in components.css; here: white boxes, labelled arrows) */
.jt-news__pagination { margin-top: 50px; }
.jt-news__pagination .nav-links { flex-wrap: wrap; justify-content: center; }
.jt-news__pagination .page-numbers { background: #fff; font-size: 14px; transition: background-color var(--jt-dur) var(--jt-ease), color var(--jt-dur) var(--jt-ease), border-color var(--jt-dur) var(--jt-ease); }
.jt-news__pagination .page-numbers.dots { background: transparent; border-color: transparent; color: var(--jt-mute); }
.jt-news__pagination .page-numbers.dots:hover { background: transparent; color: var(--jt-mute); }
.jt-news__pagination .prev, .jt-news__pagination .next { gap: 6px; padding: 0 16px; }
.jt-news__pagination .jt-icon { flex: 0 0 auto; }

@media (max-width: 1024px) {
	.jt-news__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
	.jt-news__band { padding: 20px var(--jt-gutter) 50px; }
	.jt-news__heading { font-size: 20px; line-height: 42px; } /* the source keeps the 42px line box on phones */
	.jt-news__grid { grid-template-columns: minmax(0, 1fr); }
	.jt-news .jt-news-card__body { padding: 20px 0 0; }
	.jt-news .jt-news-card__title { font-size: 14px; }
	.jt-news__pagination { margin-top: 40px; }
	.jt-news__pagination .jt-pagination__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
	.jt-news__pagination .prev, .jt-news__pagination .next { padding: 0 12px; }
}

/* ------------------------------------------------------------------ *
 * 2. Single (news + blog) — #F3F3F3 band, 1440 rail, article 65 % | sidebar 35 %
 * ------------------------------------------------------------------ */
.jt-news-single__band {
	background: var(--jt-bg-soft);
	padding: 50px 0;
}
.jt-news-single__inner {
	display: grid;
	grid-template-columns: minmax(0, 65fr) minmax(0, 35fr);
	column-gap: 20px;
	align-items: stretch;               /* the article's divider runs the full row height */
}

/* Article column: image → title → date → body → video, 12px apart, 1px divider on the right */
.jt-news-single__article {
	display: flex;
	flex-direction: column;
	gap: 12px;
	min-width: 0;
	padding-right: 50px;
	border-right: var(--jt-border-w) solid var(--jt-line);
	color: var(--jt-black);
}
.jt-news-single__media { margin: 0; }
.jt-news-single__img { display: block; width: 100%; height: auto; }
.jt-news-single__title {
	margin: 10px 0 0;
	font-family: var(--jt-font-sans);
	font-size: 30px;
	font-weight: 900;
	line-height: 1.1;
	color: var(--jt-black);
	overflow-wrap: anywhere;
}
.jt-news-single__date {
	margin: 2px 0 10px;
	font-size: 15px;
	font-weight: 500;
	line-height: 1.4;
	color: var(--jt-ink);
}
.jt-news-single__body { margin-top: 20px; }
.jt-news-single .jt-prose { font-size: var(--jt-fs-body); line-height: 1.8; color: var(--jt-black); }
.jt-news-single .jt-prose h1, .jt-news-single .jt-prose h2, .jt-news-single .jt-prose h3, .jt-news-single .jt-prose h4 {
	font-family: var(--jt-font-sans);
	font-weight: 700;
	text-transform: none;               /* editor headings are Georgian — keep Mkhedruli */
	line-height: 1.3;
}
.jt-news-single .jt-prose h1 { font-size: 24px; }
.jt-news-single .jt-prose h2 { font-size: 22px; }
.jt-news-single .jt-prose h3 { font-size: 18px; }
.jt-news-single .jt-prose h4 { font-size: 16px; }
.jt-news-single__video {
	width: 100%;
	aspect-ratio: 16 / 9;
	background: var(--jt-black);
}
.jt-news-single__iframe { display: block; width: 100%; height: 100%; border: 0; }

/* Sidebar column: sticky 20px under the fixed header (≥768), 30px inset, 20px stack gap */
.jt-news-sidebar {
	display: flex;
	flex-direction: column;
	gap: 20px;
	min-width: 0;
	padding: 30px 0 30px 30px;
	align-self: start;
	position: sticky;
	top: calc(var(--jt-header-h) + var(--jt-admin-bar, 0px) + 20px);
}
.jt-news-sidebar__list {
	display: grid;
	grid-template-columns: minmax(0, 1fr); /* 1 column on tablet too — the live 2-column tablet grid was a plugin default */
	gap: 10px;
}
.jt-news-sidebar__btn { padding-left: 0; padding-right: 0; } /* 18px 0, full width */

/* Small card (#467): photo 30 % (120px tall) | white text box 70 %, vertically centred */
.jt-news-single .jt-news-card--small { flex-direction: row; background: transparent; height: auto; }
.jt-news-single .jt-news-card--small .jt-news-card__media { flex: 0 0 30%; width: 30%; height: 120px; aspect-ratio: auto; }
.jt-news-single .jt-news-card__img { transition: transform .3s ease; } /* 0.3s as in the source; the reduced-motion rule below still wins */
.jt-news-single .jt-news-card--small .jt-news-card__body { flex: 1 1 70%; justify-content: center; gap: 5px; padding: 0 0 0 20px; background: #fff; }
.jt-news-single .jt-news-card--small .jt-news-card__title { padding-top: 10px; font-size: 14px; font-weight: 400; line-height: 20px; color: var(--jt-black); }
.jt-news-single .jt-news-card--small .jt-news-card__date { font-size: 14px; font-weight: 500; line-height: 20px; color: var(--jt-ink); }
.jt-news-single .jt-news-card--small:hover .jt-news-card__date { color: var(--jt-teal); }

@media (max-width: 767px) {
	.jt-news-single__band { padding: 20px 0; }
	.jt-news-single__inner { grid-template-columns: minmax(0, 1fr); row-gap: 30px; }
	.jt-news-single__article { padding-right: 0; border-right: 0; }
	.jt-news-single__title { margin: 5px 0 -5px; }  /* 30px stays; the source pulls the date 5px closer on phones */
	.jt-news-single__date { margin: 5px 0 0; }
	.jt-news-sidebar { position: static; padding: 0; }
	.jt-news-sidebar__list { gap: 30px; }
	.jt-news-single .jt-news-card--small { flex-direction: column; }
	.jt-news-single .jt-news-card--small .jt-news-card__media { flex-basis: auto; width: 100%; height: auto; }
	.jt-news-single .jt-news-card--small .jt-news-card__img { height: auto; }
	.jt-news-single .jt-news-card--small .jt-news-card__body { padding: 20px 0 0; }
	.jt-news-single .jt-news-card--small .jt-news-card__title { padding-top: 0; }
}

/* ------------------------------------------------------------------ *
 * 3. Motion: the only animation is the card hover (photo zoom + date colour) —
 *    off for people who asked for less motion.
 * ------------------------------------------------------------------ */
@media (prefers-reduced-motion: reduce) {
	.jt-news .jt-news-card__img, .jt-news-single .jt-news-card__img { transition: none; }
	.jt-news .jt-news-card:hover .jt-news-card__img, .jt-news-single .jt-news-card:hover .jt-news-card__img { transform: none; }
}
