/* News CSS - combined from two Code Snippets, each pulled fresh from production 2026-08-24:
   "JD: News item styling" (id 40) and "JD: News archive styling" (id 59). */

.jd-news-item:last-child {
	border-bottom: none;
}
.jd-news-date {
	flex-shrink: 0;
	width: 72px;
	font-size: 13px;
	color: var(--jd-text-muted);
}
a.jd-news-title-link {
	font-size: 14px;
	font-weight: 700;
	color: var(--jd-text);
	text-decoration: none;
}
a.jd-news-title-link:hover {
	text-decoration: underline;
}


/* ---------- News archive styling (id 59) ---------- */

/* ===== Archive header (eyebrow / title / dek / rule) ===== */
.jd-news-archive-page{ background:var(--jd-ground); padding-bottom:44px; }
.jd-archive-head{ max-width:var(--jd-max); margin:0 auto; }
.jd-archive-eyebrow{
	font-size:var(--jd-fs-label); font-weight:700; letter-spacing:var(--jd-ls-label);
	text-transform:uppercase; color:var(--jd-accent); margin:0 0 10px !important;
}
h1.jd-archive-title{ margin:0 0 12px !important; color:var(--jd-navy-dark) !important; }
.jd-archive-dek{
	font-family:var(--jd-font-serif) !important; font-style:italic !important; font-size:16.5px !important;
	color:var(--jd-text-muted) !important; max-width:620px; line-height:1.6 !important; margin:0 !important;
}
hr.jd-archive-rule{ border:none; border-top:1px solid var(--jd-rule); max-width:var(--jd-max); margin:26px auto 0; }
.jd-archive-body{ max-width:var(--jd-max); margin:0 auto; }

/* ===== rail: mini index card - reuses the footer's jd-index-*/jd-leader-list classes
   (defined in "JD: Footer", loaded head-content site-wide) verbatim, just boxed in navy
   since it's standing alone here rather than sitting on the footer's own navy band. ===== */
.jd-index-card{
	background:var(--jd-navy-dark); border-radius:var(--jd-r-lg); padding:22px;
}
.jd-index-card .jd-leader-list{ margin-top:16px; }

/* ===== rail: "submit content" invitation card - replaces the earlier subscriber-card
   clone (removed 22 Aug 2026 at Stephen's request). Uses the existing `.jd-sidebar-card` /
   `.jd-sidebar-card-heading` classes verbatim (defined in "JD: Organisation sidebar styling",
   loaded site-wide) for the box + heading, so only the copy and link needed new rules. Links
   to the site's existing Contact Us page - there is no dedicated news-submission form yet
   (only "Submit a book" exists as a precedent). ===== */
.jd-submit-copy{
	font-size:13.5px; color:var(--jd-text-muted); line-height:1.6; margin:0 0 14px;
}
a.jd-submit-link{
	font-size:13px; font-weight:700; color:var(--jd-navy); text-decoration:none;
}
a.jd-submit-link:hover{ color:var(--jd-accent); text-decoration:underline; }

/* ===== news card grid ===============================================================
   IMPORTANT STRUCTURE NOTE (found by live DOM inspection after the first pass of this
   snippet shipped with the wrong assumption): the classic-skin Posts widget's outer
   `.elementor-posts-container.elementor-posts` grid div is a DESCENDANT of the widget
   wrapper that carries our `jd-news-grid` class - it is NOT the same element - so the
   grid rule must be a descendant selector (`.jd-news-grid .elementor-posts`), never a
   compound one (`.jd-news-grid.elementor-posts`), or it silently matches nothing.
   Likewise each `article.elementor-post` has only TWO direct children - the thumbnail
   link, then a single `.elementor-post__text` wrapper holding title/meta/excerpt/read-
   more together - not four separate siblings. Flex `order` is set on those two children
   (thumbnail, text-wrapper), not on the text pieces individually. ===== */
.jd-news-grid .elementor-posts{
	display:grid !important;
	grid-template-columns:1fr 1fr;
	gap:22px;
}
.jd-news-grid .elementor-post{
	display:flex !important;
	flex-direction:column !important;
	background:var(--jd-surface);
	border:1px solid var(--jd-rule);
	border-radius:var(--jd-r-lg);
	overflow:hidden;
	padding-bottom:20px;
	transition:border-color .15s ease, box-shadow .15s ease;
	margin:0 !important;
}
.jd-news-grid .elementor-post:hover{ border-color:#d8d2c4; box-shadow:0 6px 18px rgba(26,51,82,.07); }
.jd-news-grid .elementor-post__thumbnail__link{
	order:1; width:100% !important; float:none !important; margin:0 !important;
	aspect-ratio:16/9; display:block; overflow:hidden;
}
.jd-news-grid .elementor-post__thumbnail{ width:100% !important; height:100% !important; }
.jd-news-grid .elementor-post__thumbnail img{ width:100% !important; height:100% !important; object-fit:cover !important; display:block; }

/* Static "News" pill - safe as a plain ::before rather than a dynamic label because this
   widget is hard-filtered to posts_include_term_ids:["717"] (the News term) - every article
   rendered here carries category-news already. Scoped to .jd-news-grid so it only fires in
   this specific grid instance if the class is ever reused elsewhere with mixed categories. */
.jd-news-grid article.category-news::before{
	content:"News"; order:2; align-self:flex-start;
	background:var(--jd-accent-soft); color:var(--jd-accent);
	font-size:11px; font-weight:700; letter-spacing:.07em; text-transform:uppercase;
	padding:4px 10px; border-radius:var(--jd-r-pill);
	margin:16px 20px 0;
}
.jd-news-grid .elementor-post__text{ order:3; display:flex; flex-direction:column; padding:0 20px; }
.jd-news-grid h3.elementor-post__title{ margin:12px 0 8px !important; }

/* Hybrid per Stephen's approval: Proposal A's card structure with Proposal B's serif titles.
   Element-id selector included alongside the class selector per the site's established
   specificity rule (a JD rule must target the same element Elementor targets directly). */
.elementor-element-6f8f326 .jd-news-grid h3.elementor-post__title a,
.jd-news-grid h3.elementor-post__title a{
	font-family:var(--jd-font-serif) !important;
	font-weight:700 !important;
	font-style:normal !important;
	font-size:18px !important;
	line-height:1.35 !important;
	color:var(--jd-text) !important;
	text-decoration:none !important;
}
.jd-news-grid .elementor-post__title a:hover{ color:var(--jd-navy) !important; text-decoration:underline !important; }
.jd-news-grid .elementor-post__meta-data{ margin:0 0 8px; font-size:12.5px; color:var(--jd-text-muted); }
.jd-news-grid .elementor-post__excerpt{ margin:0 0 10px; }
.jd-news-grid .elementor-post__excerpt p{
	font-size:13.5px; color:var(--jd-text-muted); line-height:1.6; margin:0;
	display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
}
.jd-news-grid a.elementor-post__read-more{
	margin-top:auto !important; padding-top:6px; align-self:flex-start;
	font-size:13px !important; font-weight:600 !important; color:var(--jd-navy) !important; text-decoration:none !important;
}
.jd-news-grid a.elementor-post__read-more:hover{ color:var(--jd-accent) !important; }

/* Native Elementor "load more" pagination button (pagination_type switched from
   load_more_infinite_scroll to load_more_on_click on the widget itself - an explicit button
   reads calmer than an auto-loading feed, matching "a continuing record" rather than a feed). */
.jd-archive-main .elementor-button{
	font-family:var(--jd-font) !important; font-size:13px !important; font-weight:700 !important;
	letter-spacing:.04em; text-transform:uppercase;
	color:var(--jd-navy) !important; background:transparent !important; border:1px solid var(--jd-navy) !important;
	padding:12px 26px !important; border-radius:var(--jd-r-pill) !important;
}
.jd-archive-main .elementor-button:hover{ background:var(--jd-navy) !important; color:#fff !important; }

@media (max-width:900px){
	.jd-news-grid .elementor-posts{ grid-template-columns:1fr; }
}