/* News section — landing page (newsTemplate.php) and single news posts (single-news.php).
   Landing page design mirrors the NEW homepage (page-Home-New.php):
   popular module = #home-slider-products, feed = #home-separator + #home-recent-posts. */

/* #main-content has padding:60px 0 (style.css:2092, mobile 30px !important) —
   the feed section is the last element, so kill the white strip at the bottom */
#main-content.news-landing{
	padding-bottom:0 !important;
}

.news-landing .is-hidden{
	display:none !important;
}

/* fallback for unlinked breadcrumb items — the breadcrumb layout is float-based */
#breadcrumb ol li > span.news-crumb-plain{
	float:left;
	font-weight:600;
}

#news-feed-grid.news-loading{
	opacity:0.4;
	pointer-events:none;
	transition:opacity 0.2s;
}

/* ---- Landing page: intro ---- */

.news-landing .news-intro{
	margin-bottom:30px;
	text-align:left;
}

/* ---- Search / sort bar (lives inside the dark #news-separator band — flat, no shadows) ---- */

.news-search-bar{
	max-width:800px;
	margin:20px auto 0 auto;
}

.news-search-bar form{
	display:flex;
	flex-wrap:wrap;
	gap:10px;
	align-items:center;
	justify-content:center;
	margin:0;
}

.news-search-bar input[type="text"]{
	flex:1 1 250px;
	height:42px;
	padding:0 12px;
	background:transparent;
	border:1px solid rgba(249,249,249,0.6);
	border-radius:6px;
	font-size:16px;
	color:#f9f9f9;
}

.news-search-bar input[type="text"]::placeholder{
	color:rgba(249,249,249,0.7);
}

.news-search-bar select{
	height:42px;
	padding:0 38px 0 12px;
	background-color:#032936;
	border:1px solid rgba(249,249,249,0.6);
	border-radius:6px;
	font-size:16px;
	color:#f9f9f9;
	-webkit-appearance:none;
	-moz-appearance:none;
	appearance:none;
	background-image:url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%23f9f9f9' stroke-width='2' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
	background-repeat:no-repeat;
	background-position:right 14px center;
}

.news-search-bar button{
	height:42px;
	background:#285bb8;
	color:#f9f9f9;
	border:none;
	border-radius:6px;
	padding:0 20px;
	font-size:16px;
	font-weight:600;
	cursor:pointer;
}

.news-search-bar button:hover{
	background:#284985;
}

.news-search-clear{
	font-size:14px;
	color:#abb9dd;
}

.news-search-clear:hover{
	color:#f9f9f9;
}

/* ---- Buttons (same as new homepage .home-btn) ---- */

.news-landing .home-btn{
	color:#f9f9f9;
	background:#285bb8;
	padding:10px 16px;
	font-size:18px;
	font-weight:600;
	border-radius:6px;
	display:inline-block;
}

.news-landing .home-btn:hover{
	background-color:#284985;
	color:#fff;
	text-decoration:underline;
}

/* ---- Most popular slider (mirrors #home-slider-products) ---- */

#news-popular-slider{
	width:100%;
	display:inline-block;
	background:#fff;
	color:#032936;
	padding:0;
	text-align:center;
}

#news-popular-slider h2{
	font-weight:bold;
}

#news-popular-slider img{
	width:100%;
	height:auto;
}

#news-popular-slider .home-product{
	padding:0;
	margin:20px 0 50px 0;
	border-radius:0px;
	box-shadow:none;
	position:relative;
	text-align:left;
	display:inline-block;
}

#news-popular-slider .home_image_wrap{
	position:relative;
	border-radius:25px 0 0 0;
	overflow:hidden;
}

#news-popular-slider .home_image_wrap a{
	display:block;
}

/* #main-content img (style.css:2168) adds margin:10px 0 20px 0 + 5px radius — neutralize inside news cards.
   aspect-ratio + object-fit normalize thumbnails of any proportions to 16:9. */
#main-content #news-popular-slider .home_image_wrap img,
#news-popular-slider .home_image_wrap img{
	display:block;
	width:100%;
	margin:0;
	border-radius:0;
	aspect-ratio:16 / 9;
	object-fit:cover;
}

#news-popular-slider .news-views-badge{
	position:absolute;
	top:0;
	right:0;
	background:#032936;
	color:#f9f9f9;
	padding:5px 12px;
	font-size:14px;
	border-radius:0 0 0 10px;
	z-index:2;
}

#news-popular-slider .news-views-badge i{
	margin-right:5px;
}

#news-popular-slider .date-rating{
	display:flex;
	align-items:center;
	justify-content:space-between;
	width:100%;
	background:#032936;
	color:#f9f9f9;
	padding:0 10px;
	margin-top:-1px;
}

#news-popular-slider .home-date{
	min-height:24px;
	margin:10px 0;
}

#news-popular-slider .news-cat-bar{
	margin:0;
	font-size:16px;
	font-weight:normal;
	opacity:0.8;
}

/* consistent 15px rhythm: image/bar -> title -> excerpt -> button */
#news-popular-slider .home-product-description{
	padding:15px 0 0 0;
	text-align:center;
}

/* #main-content h3 (style.css:2209) and #main-content h3 a (style.css:2128) force a large
   underlined title — override to match .home-product h3 on the new homepage (20px/500, no underline) */
#main-content #news-popular-slider .home-product h3,
#news-popular-slider .home-product h3{
	font-family:'Mulish', Arial, sans-serif;
	font-size:20px;
	font-weight:500;
	margin:0 0 15px 0;
}

#main-content #news-popular-slider .home-product h3 a,
#news-popular-slider .home-product h3 a{
	color:#032936;
	text-decoration:none;
}

#main-content #news-popular-slider .home-product h3 a:hover,
#news-popular-slider .home-product h3 a:hover{
	text-decoration:none;
	color:#3d6abf;
}

#news-popular-slider .article-description{
	color:#666666;
	font-size:16px;
	line-height:24px;
	margin:0 0 15px 0;
	max-width:100%;
	text-align:center;
}

#news-popular-slider .home-btn{
	margin:0;
}

/* Slick sizes the track to slideCount x slide width. With fewer than 3 published
   posts the Bootstrap col max-width (33.33%) then resolves against that narrow
   track and crushes the cards — let slick's computed slide width win, and keep
   a short track centered instead of stuck left. */
#news-popular .slick-slide{
	max-width:none;
}

#news-popular .slick-track{
	margin-left:auto;
	margin-right:auto;
}

/* Arrows outside the cards, vertically centered — style.css has competing .slick-arrow
   blocks (1922 and 8356), so pin the position explicitly for this slider */
#news-popular-slider .slick-arrow{
	color:#285bb8;
	position:absolute;
	top:50%;
	bottom:auto;
	margin-top:-30px;
	font-size:50px;
	z-index:1000;
	cursor:pointer;
}

#news-popular-slider .fa-angle-left.slick-arrow{
	left:-40px;
	right:auto;
}

#news-popular-slider .fa-angle-right.slick-arrow{
	right:-40px;
	left:auto;
}

#news-popular-slider .slick-arrow:hover{
	color:#284985;
}

/* ---- Separator band (mirrors #home-separator) ---- */

/* feed cards overlap the band bottom by ~65px (container margin -165px
   minus the feed section's 100px top padding) — 110px padding leaves a
   ~45px gap between the search bar and the cards */
#news-separator{
	background:#032936;
	color:#f9f9f9;
	text-align:center;
	width:100%;
	display:inline-block;
	padding:40px 0 110px 0;
	scroll-margin-top:130px;
}

#news-separator h2{
	font-weight:bold;
	margin:0 0 10px 0;
}

/* ---- Feed (mirrors #home-recent-posts) ---- */

#news-recent-posts{
	width:100%;
	display:inline-block;
	background:#f9f9f9;
	color:#032936;
	padding:100px 0 40px 0;
	text-align:center;
}

#news-recent-posts .container{
	margin-top:-165px;
}

/* term archives have no dark separator band above the grid — no overlap pull-up */
#news-recent-posts.news-tax-archive{
	padding:40px 0;
}

#news-recent-posts.news-tax-archive .container{
	margin-top:0;
}

#news-recent-posts .blog-article-new{
	padding:0 10px;
	margin:0 0 20px 0;
	position:relative;
	text-align:center;
	display:inline-block;
	width:100%;
}

#news-recent-posts .news-image-wrap{
	position:relative;
	border-radius:25px 0 0 0;
	overflow:hidden;
}

#news-recent-posts .news-image-wrap a{
	display:block;
}

#main-content #news-recent-posts .blog-article-new img,
#news-recent-posts .blog-article-new img{
	display:block;
	width:100%;
	height:auto;
	margin:0;
	border-radius:25px 0 0 0;
	aspect-ratio:16 / 9;
	object-fit:cover;
}

/* feed variant: bottom-right so it doesn't blend into the dark separator
   band above the first row (overrides the unscoped top-right base) */
#news-recent-posts .news-cat-badge{
	top:auto;
	bottom:0;
	border-radius:10px 0 0 0;
}

#news-recent-posts .blog-article-new h4{
	font-weight:bold;
	margin:0 0 15px 0;
}

#news-recent-posts .blog-article-new h4 a{
	color:#032936;
}

#news-recent-posts .blog-article-new a:hover{
	text-decoration:none;
}

#news-recent-posts .blog-article-new h4 a:hover{
	color:#3d6abf;
	text-decoration:none;
}

#news-recent-posts .blog-article-new .blog-text-wrap-container{
	width:100%;
	border-left:1px solid #032936;
	border-right:1px solid #032936;
	border-bottom:1px solid #032936;
	padding:15px 10px 60px 10px;
	border-radius:0 0 25px 0;
	display:inline-block;
	min-height:240px;
	background:#fff;
}

#news-recent-posts .blog-article-new .article-footer{
	width:calc(100% - 50px);
	border-top:1px solid #032936;
	margin:0 15px;
}

#news-recent-posts .blog-article-new .article-footer p{
	margin-bottom:0px;
	margin-top:5px;
	color:#032936;
}

#news-recent-posts .article-description{
	color:#666666;
	font-size:16px;
	line-height:24px;
	margin:0 0 15px 0;
	max-width:100%;
}

#news-recent-posts .news-updated-flag{
	margin:-5px 0 15px 0;
}

#news-recent-posts .news-no-results{
	padding:40px 0;
}

/* ---- Updated flag (both card types) ---- */

.news-updated-flag{
	color:#285bb8;
	font-size:14px;
	margin:0 0 10px 0;
}

.news-updated-flag i{
	margin-right:5px;
}

#news-popular-slider .news-updated-flag{
	margin:-5px 0 15px 0;
}

/* ---- Pagination ---- */

.news-pagination{
	width:100%;
	display:inline-block;
	text-align:center;
	margin:30px 0 0 0;
}

.news-pagination .page-numbers{
	display:inline-block;
	padding:6px 14px;
	margin:0 3px;
	border-radius:6px;
	background:#fff;
	color:#285bb8;
	box-shadow:0px 0px 5px #ccc;
	text-decoration:none;
}

.news-pagination .page-numbers.current{
	background:#285bb8;
	color:#fff;
}

.news-pagination .page-numbers:hover{
	background:#032936;
	color:#fff;
}

/* ---- Single news post ---- */

.news-meta time{
	white-space:nowrap;
}

/* featured image with category badge top-right (same chip as the landing page) */
.news-image-wrap{
	position:relative;
}

/* #main-content img adds margin:10px 0 20px — the top margin pushed the image
   10px below the badge anchored to the wrap; ID-prefixed to actually win */
#main-content .news-image-wrap img,
.news-image-wrap img{
	margin-top:0;
}

.news-cat-badge{
	position:absolute;
	top:0;
	right:0;
	background:#032936;
	color:#f9f9f9;
	padding:5px 12px;
	font-size:14px;
	border-radius:0 0 0 10px;
	z-index:2;
}

/* ---- Sources block ---- */

.news-sources{
	width:100%;
	float:left;
	margin:30px 0;
	padding:20px 25px;
	background:#f9f9f9;
	border-radius:6px;
	border-left:4px solid #285bb8;
}

/* #main-content content styles add big heading margins and list indents —
   higher-specificity overrides keep the box compact and left-aligned */
#main-content .news-sources .news-sources-title,
.news-sources .news-sources-title{
	font-size:18px;
	color:#032936;
	margin:0 0 12px 0;
	padding:0;
}

/* #main-content ol (style.css:2233) numbers items via an absolute ::before at
   left:0 and needs padding-left:25px on the li for it — keep that, kill the
   ol's own 30px side padding (the huge indent) */
#main-content .news-sources .news-sources-list,
.news-sources .news-sources-list{
	margin:0;
	padding:0;
	text-align:left;
}

#main-content .news-sources .news-sources-list li,
.news-sources .news-sources-list li{
	margin:0 0 8px 0;
	padding:0 0 0 25px;
	font-size:15px;
	color:#666666;
	text-align:left;
}

/* the global ::before counter sits at top:4px (tuned for 18px content text) —
   realign for the smaller 15px source items */
#main-content .news-sources .news-sources-list li::before,
.news-sources .news-sources-list li::before{
	top:0;
	line-height:23px;
}

.news-sources .news-sources-list a{
	color:#285bb8;
	text-decoration:none;
}

.news-sources .news-sources-list a:hover{
	color:#032936;
	text-decoration:underline;
}

/* ---- Responsive ---- */

@media (max-width: 767px){
	.news-search-bar form{
		flex-direction:column;
		align-items:stretch;
	}
}

@media (max-width: 600px){
	#news-recent-posts{
		padding-bottom:50px;
	}

	#news-separator{
		padding-left:15px;
		padding-right:15px;
	}
}

@media (max-width: 576px){
	#news-popular-slider .slider-container{
		padding:0px 40px !important;
	}

	#news-popular-slider .slick-arrow{
		display:inline-block !important;
	}

	#news-popular-slider .fa-angle-left.slick-arrow{
		left:-20px !important;
		opacity:1 !important;
	}

	#news-popular-slider .fa-angle-right.slick-arrow{
		right:-20px !important;
		opacity:1 !important;
	}

	#news-recent-posts .blog-article-new .blog-text-wrap-container{
		padding-bottom:57px;
	}
}