/**
 * nc/content-slider — front-end styles.
 *
 * Simple layout: a content-slide carousel (scroll-snap track + prev/next + progress).
 * Blog layout (.nc-cslider--blog): the legacy dual-content slider — a left intro
 * column (BLOG eyebrow, sliding blog-brand slides, a NN/NN counter + progress line,
 * an orange CTA) beside a horizontal carousel of recent-post cards, on a light-blue
 * band. Brand navy #062537 / blue #0067b1 / card blue #2a5f9e / orange #ff6200.
 */
.nc-cslider {
	padding: 48px 0;
}

.nc-cslider__inner {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 24px;
}

.nc-cslider__heading {
	margin: 0 0 24px;
	color: #062537;
	font-family: "Vollkorn", Georgia, serif;
	font-size: clamp( 26px, 3vw, 36px );
	font-weight: 600;
}

/* ----------------------------------------------------------- slide track --- */
.nc-cslider__viewport {
	overflow: hidden;
}

.nc-cslider__track {
	display: flex;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.nc-cslider__track::-webkit-scrollbar { display: none; }

.nc-cslider__slide {
	flex: 0 0 100%;
	scroll-snap-align: start;
	min-width: 0;
	padding-right: 1px; /* avoid sub-pixel bleed of the next slide */
}

.nc-cslider__slide-title {
	margin: 0 0 16px;
	color: #062537;
	font-family: "Vollkorn", Georgia, serif;
	font-size: clamp( 24px, 3vw, 36px );
	font-weight: 600;
	line-height: 1.2;
}

.nc-cslider__slide-text {
	color: #062537;
	font-size: 1rem;
	line-height: 1.65;
}

.nc-cslider__slide-text p { margin: 0 0 1em; }
.nc-cslider__slide-text p:last-child { margin-bottom: 0; }

/* -------------------------------------------------------------- controls --- */
.nc-cslider__controls {
	display: flex;
	align-items: center;
	gap: 18px;
	margin-top: 28px;
}

.nc-cslider__btn {
	flex: 0 0 auto;
	width: 46px;
	height: 46px;
	padding: 0;
	border: 1px solid #0067b1;
	border-radius: 50%;
	background: #fff;
	cursor: pointer;
	position: relative;
	transition: background-color 0.15s ease, opacity 0.15s ease;
}

.nc-cslider__btn::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 9px;
	height: 9px;
	border-top: 2px solid #0067b1;
	border-right: 2px solid #0067b1;
}

.nc-cslider__btn--prev::before { transform: translate( -40%, -50% ) rotate( -135deg ); }
.nc-cslider__btn--next::before { transform: translate( -60%, -50% ) rotate( 45deg ); }

.nc-cslider__btn:hover:not( :disabled ) { background: #eaf3fa; }
.nc-cslider__btn:disabled { opacity: 0.35; cursor: default; }
.nc-cslider__btn:focus-visible { outline: 3px solid #0067b1; outline-offset: 2px; }

.nc-cslider__progress {
	flex: 1 1 auto;
	height: 4px;
	border-radius: 2px;
	background: #c9dcec;
	overflow: hidden;
}

.nc-cslider__progress-bar {
	display: block;
	height: 100%;
	width: 0;
	background: #0067b1;
	border-radius: 2px;
	transition: width 0.25s ease;
}

/* =============================================================== blog band === */
/* The light-blue band is the INNER element (the full-bleed section wrapper is left to
   the theme's alignment). Inset by the page content gutter so the band sits inside the
   same column as the rest of the page with white margins — like the legacy, NOT edge to
   edge. The post cards bleed to the band's right edge. */
.nc-cslider--blog {
	padding: 0;
}

.nc-cslider--blog .nc-cslider__inner {
	margin-inline: var( --nc-content-gutter, 60px );
	background: #e8f4f8;
	display: grid;
	grid-template-columns: minmax( 0, 430px ) minmax( 0, 1fr );
	gap: clamp( 28px, 3vw, 56px );
	align-items: center;
	max-width: none;
	padding: clamp( 40px, 4.5vw, 72px ) 0 clamp( 40px, 4.5vw, 72px ) clamp( 28px, 3vw, 60px );
}

.nc-cslider--blog .nc-cslider__main {
	max-width: 460px;
}

.nc-cslider__eyebrow {
	margin: 0 0 14px;
	color: #0067b1;
	font-size: 20px;
	font-weight: 600;
	line-height: 1;
}

/* The blog brand slides reuse the slide track; titles are serif. */
.nc-cslider--blog .nc-cslider__slide-title {
	margin: 0 0 14px;
	font-size: clamp( 26px, 2.4vw, 36px );
}

.nc-cslider--blog .nc-cslider__slide-text {
	color: #2a3942;
	font-size: 16px;
}

/* Counter + progress line + minimal chevrons (the legacy "01 / 04 ———"). */
.nc-cslider--blog .nc-cslider__controls {
	gap: 16px;
	margin-top: 30px;
}

.nc-cslider--blog .nc-cslider__btn {
	width: 34px;
	height: 34px;
	background: transparent;
	border-color: #9cc1de;
}

.nc-cslider--blog .nc-cslider__btn:hover:not( :disabled ) { background: #fff; }

.nc-cslider__count {
	flex: 0 0 auto;
	font-size: 15px;
	letter-spacing: 0.06em;
	color: #5a7c98;
	font-variant-numeric: tabular-nums;
}

.nc-cslider__count-cur {
	color: #0067b1;
	font-weight: 700;
}

.nc-cslider__cta-wrap {
	margin-top: 28px;
}

.nc-cslider__cta {
	display: inline-block;
	padding: 13px 30px;
	background: #ff6200;
	color: #fff;
	font-size: 16px;
	font-weight: 600;
	letter-spacing: 0.01em;
	text-decoration: none;
	transition: background-color 0.15s ease;
}

.nc-cslider__cta:hover { background: #e25800; }

/* ---- recent-post cards (right) -------------------------------------------- */
.nc-cslider__cards-viewport {
	min-width: 0;
}

.nc-cslider__cards-heading {
	margin: 0 0 18px;
	color: #062537;
	font-family: "Vollkorn", Georgia, serif;
	font-size: 24px;
	font-weight: 600;
}

.nc-cslider__cards {
	display: flex;
	gap: 30px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	scrollbar-width: none;
	-ms-overflow-style: none;
	padding-bottom: 4px;
}

.nc-cslider__cards::-webkit-scrollbar { display: none; }

.nc-cslider__card {
	flex: 0 0 var( --nc-cslider-card-w, 384px );
	scroll-snap-align: start;
	display: flex;
	flex-direction: column;
	background: #2a5f9e;
	color: #fff;
}

.nc-cslider__card-media {
	display: block;
	line-height: 0;
}

.nc-cslider__card-img {
	display: block;
	width: 100%;
	height: auto; /* beat the <img> height attribute so the 16/9 box wins */
	aspect-ratio: 16 / 9;
	object-fit: cover;
}

.nc-cslider__card-img--empty { background: #36629d; }

.nc-cslider__card-body {
	flex: 1 1 auto;
	padding: 22px 26px 20px;
}

.nc-cslider__card-title {
	margin: 0 0 14px;
	font-size: 16px;
	font-weight: 600;
	line-height: 1.32;
	text-transform: uppercase;
	letter-spacing: 0.01em;
}

.nc-cslider__card-title a {
	color: #fff;
	text-decoration: none;
}

.nc-cslider__card-title a:hover { text-decoration: underline; }

.nc-cslider__card-date {
	margin: 0 0 16px;
	font-size: 14px;
	text-transform: uppercase;
	letter-spacing: 0.02em;
	color: rgba( 255, 255, 255, 0.82 );
}

.nc-cslider__card-excerpt {
	margin: 0;
	font-size: 15px;
	line-height: 1.55;
	color: rgba( 255, 255, 255, 0.92 );
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.nc-cslider__card-more {
	display: block;
	padding: 14px 16px;
	background: #10263f;
	color: #fff;
	text-align: center;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.02em;
	text-decoration: none;
	transition: background-color 0.15s ease;
}

.nc-cslider__card-more:hover { background: #0067b1; }

/* ---- responsive ----------------------------------------------------------- */
@media ( max-width: 900px ) {
	.nc-cslider--blog .nc-cslider__inner {
		grid-template-columns: 1fr;
		gap: 28px;
		padding: 0 var( --nc-content-gutter, 24px );
	}

	.nc-cslider--blog .nc-cslider__main { max-width: none; }

	.nc-cslider__cards-viewport {
		margin-right: calc( -1 * var( --nc-content-gutter, 24px ) ); /* let cards bleed right on mobile too */
	}

	.nc-cslider__card { flex-basis: 300px; }
}