.cs-slider-section {
	--cs-accent: #c1272d;
	--cs-accent-dark: #8f1c21;
	--cs-dark: #14161f;
	--cs-cream: #f6f1ec;
	--cs-media-bg: #fbecea;
	--cs-text: #17171c;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	color: var(--cs-text);
	max-width: 1220px;
	margin: 0 auto;
	padding: 48px 0 64px;
	box-sizing: border-box;
}
.cs-slider-section *, .cs-slider-section *::before, .cs-slider-section *::after {
	box-sizing: border-box !important;
}

/* ---------- Header ---------- */
.cs-slider-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	flex-wrap: wrap;
	margin-bottom: 36px;
}
.cs-header-left { max-width: 480px; }
.cs-eyebrow {
	display: inline-block;
	color: var(--cs-accent);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.08em;
	margin-bottom: 10px;
}
.cs-heading {
	font-size: clamp(26px, 3vw, 40px);
	font-weight: 800;
	margin: 0 0 8px;
	line-height: 1.15;
}
.cs-heading-main { color: var(--cs-text); }
.cs-heading-accent {
	color: var(--cs-accent);
	font-family: Georgia, "Times New Roman", serif;
	font-style: italic;
	font-weight: 700;
}
.cs-desc {
	font-size: 14px;
	color: #6b6b6b;
	margin: 0;
	line-height: 1.5;
}

/* ---------- Nav (pill container with avatar + arrows) ---------- */
.cs-header-nav {
	display: flex;
	align-items: center;
	gap: 18px;
	background: #fff;
	border-radius: 999px;
	padding: 8px 20px;
	box-shadow: 0 2px 14px rgba(0,0,0,0.06);
}
.cs-avatar-dot {
	width: 26px; height: 26px;
	border-radius: 50%;
	background: var(--cs-dark);
	color: #fff;
	font-size: 12px;
	font-weight: 600;
	border: none;
	cursor: default;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
}
.cs-prev-btn, .cs-next-btn {
	background: none !important;
	background-color: transparent !important;
	border: none !important;
	box-shadow: none !important;
	outline: none !important;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.05em;
	cursor: pointer;
	color: var(--cs-text) !important;
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 6px 12px;
	appearance: none;
	-webkit-appearance: none;
	transition: background-color .2s ease, color .2s ease;
}
.cs-prev-btn:hover, .cs-next-btn:hover,
.cs-prev-btn:focus, .cs-next-btn:focus,
.cs-prev-btn:active, .cs-next-btn:active,
.cs-prev-btn:visited, .cs-next-btn:visited {
	background: rgba(193, 39, 45, 0.1) !important;
	border: none !important;
	box-shadow: none !important;
	outline: none !important;
	color: var(--cs-accent) !important;
	text-decoration: none !important;
}
.cs-prev-btn:disabled, .cs-next-btn:disabled { opacity: 0.35; cursor: not-allowed; }
.cs-prev-btn:disabled:hover, .cs-next-btn:disabled:hover {
	background: none !important;
	color: var(--cs-text) !important;
}
.cs-arrow { font-size: 14px; }
.cs-counter {
	font-size: 14px;
	font-weight: 600;
	white-space: nowrap;
}
.cs-counter .cs-current { color: var(--cs-accent); }

.cs-cta-btn {
	background: linear-gradient(135deg, var(--cs-accent), var(--cs-accent-dark));
	color: #fff !important;
	text-decoration: none;
	font-size: 13px;
	font-weight: 700;
	padding: 16px 26px;
	border-radius: 14px;
	white-space: nowrap;
	transition: transform .2s ease;
	display: inline-block;
}
.cs-cta-btn:hover { transform: translateY(-2px); }

/* ---------- Viewport / Track ---------- */
.cs-slider-viewport {
	position: relative;
	overflow: hidden;
	padding: 10px 0 40px;
	perspective: 1400px;
}
.cs-slider-track {
	display: flex;
	align-items: stretch;
	gap: 20px;
	will-change: transform;
	transition: transform .55s cubic-bezier(.22,.68,0,1);
}

.cs-slide {
	flex: 0 0 auto;
	width: 80%;
	transition: transform .55s cubic-bezier(.22,.68,0,1), opacity .55s ease, filter .55s ease;
	cursor: pointer;
	transform-style: preserve-3d;
}
.cs-slide.cs-active { cursor: default; }

.cs-slide.cs-active { transform: scale(1) rotateY(0deg); opacity: 1; filter: none; z-index: 3; }
.cs-slide.cs-adjacent { transform: scale(0.88) rotateY(0deg); opacity: 1; filter: grayscale(55%) brightness(0.35); z-index: 2; }
.cs-slide.cs-far { transform: scale(0.8) rotateY(0deg); opacity: 1; filter: grayscale(75%) brightness(0.22); z-index: 1; }

/* Extra dark overlay tint on top of the peeking (non-active) slides */
.cs-slide-inner { position: relative; }
.cs-slide-inner::after {
	content: "";
	position: absolute;
	inset: 0;
	background: transparent;
	border-radius: inherit;
	pointer-events: none;
	transition: background .55s ease;
}
.cs-slide.cs-adjacent .cs-slide-inner::after { background: rgba(5, 5, 10, 0.65); }
.cs-slide.cs-far .cs-slide-inner::after { background: rgba(5, 5, 10, 0.8); }

.cs-slide.cs-adjacent.cs-side-left { transform: scale(0.88) rotateY(10deg); transform-origin: right center; }
.cs-slide.cs-adjacent.cs-side-right { transform: scale(0.88) rotateY(-10deg); transform-origin: left center; }
.cs-slide.cs-far.cs-side-left { transform: scale(0.8) rotateY(14deg); transform-origin: right center; }
.cs-slide.cs-far.cs-side-right { transform: scale(0.8) rotateY(-14deg); transform-origin: left center; }

/* ---------- Slide card: white text half + tinted image half ---------- */
.cs-slide-inner {
	display: grid !important;
	grid-template-columns: minmax(0, 48%) minmax(0, 1fr) !important;
	align-items: stretch;
	min-height: 580px;
	border-radius: 26px;
	overflow: hidden;
	box-shadow: 0 20px 50px rgba(0,0,0,0.08);
	width: 100%;
}

.cs-slide-text {
	background: #ffffff;
	border-radius: 26px 0 0 26px;
	min-width: 0;
	max-width: 100%;
	overflow: hidden;
	padding: 32px 34px 30px;
	position: relative;
}

.cs-slide-media {
	background: var(--cs-media-bg);
	border-radius: 0 26px 26px 0;
	min-width: 0;
	max-width: 100%;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 40px 24px;
	overflow: hidden;
}

.cs-tag {
	display: inline-block;
	color: var(--cs-accent);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.08em;
	margin-bottom: 10px;
}
.cs-slide-title {
	font-size: clamp(22px, 2.2vw, 30px);
	font-weight: 800;
	margin: 0 0 10px;
	line-height: 1.15;
}
.cs-slide-subtitle {
	font-size: 14px;
	color: #6b6b6b;
	line-height: 1.6;
	margin: 0 0 20px;
	padding-bottom: 18px;
	border-bottom: 1px solid rgba(0,0,0,0.08);
}

.cs-feature-list {
	list-style: none;
	margin: 0 0 20px;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 14px;
}
.cs-feature-list li {
	display: flex;
	gap: 14px;
	align-items: flex-start;
}
.cs-feature-icon {
	flex: 0 0 auto;
	width: 34px; height: 34px;
	border-radius: 50%;
	background: #fbe4e2;
	color: var(--cs-accent);
	display: flex;
	align-items: center;
	justify-content: center;
}
.cs-feature-icon .dashicons { font-size: 17px; width: 17px; height: 17px; }
.cs-feature-text { display: flex; flex-direction: column; gap: 2px; }
.cs-feature-text strong { font-size: 14px; font-weight: 700; }
.cs-feature-text span { font-size: 12.5px; color: #7a7a7a; }

.cs-tech-pills { display: flex; flex-wrap: wrap; gap: 8px; }
.cs-pill {
	background: #f0eeeb;
	border: 1px solid #e2ded8;
	color: #444;
	font-size: 11px;
	font-weight: 600;
	padding: 6px 12px;
	border-radius: 999px;
}

.cs-slide-media img.cs-shot {
	display: block !important;
	position: relative !important;
	max-width: 100% !important;
	height: 500px !important;
	width: auto !important;
	object-fit: contain !important;
	border-radius: 22px;
	box-shadow: none !important;
	margin: 0 !important;
	float: none !important;
}

.cs-badge {
	position: absolute;
	left: 24px;
	bottom: 20px;
	background: #14161f;
	color: #fff;
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 8px 14px;
	border-radius: 12px;
	font-size: 12px;
	font-weight: 700;
	z-index: 3;
}
.cs-badge img { width: 16px; height: 16px; object-fit: contain; }

/* ---------- Responsive ---------- */
@media (max-width: 900px) {
	.cs-slide-inner { grid-template-columns: 1fr !important; min-height: 0; }
	.cs-slide-text { max-width: 100%; border-radius: 26px 26px 0 0; }
	.cs-slide-media { border-radius: 0 0 26px 26px; min-height: 320px; }
	.cs-slide-media img.cs-shot { height: 300px !important; }
	.cs-slider-header { align-items: flex-start; }
	.cs-slide { width: 92%; }
}
@media (max-width: 600px) {
	.cs-slide { width: 90%; }
	.cs-slide.cs-adjacent .cs-slide-inner::after { background: rgba(5, 5, 10, 0.7); }
	.cs-slide.cs-far .cs-slide-inner::after { background: rgba(5, 5, 10, 0.85); }
	.cs-slide.cs-adjacent.cs-side-left, .cs-slide.cs-adjacent.cs-side-right,
	.cs-slide.cs-far.cs-side-left, .cs-slide.cs-far.cs-side-right { transform: scale(0.9) rotateY(0deg); }
	.cs-header-nav { order: 3; width: 100%; justify-content: space-between; }
	.cs-cta-btn { order: 2; }
}
