/* =========================================================
   NPC Industries We Serve — Frontend Styles
   Scope: only [npc_industries_we_serve] shortcode output.
   ========================================================= */
.npc-iws-carousel,
		.npc-iws-carousel * {
			box-sizing: border-box;
		}

		.npc-iws-carousel {
			--npc-iws-cols: 4;
			--npc-iws-gap: 46px;

			--npc-iws-side-margin: 0%;
			--npc-iws-side-padding: 2%;

			width: 100%;
			position: relative;

			margin-left: var(--npc-iws-side-margin);
			margin-right: var(--npc-iws-side-margin);

			padding-left: var(--npc-iws-side-padding);
			padding-right: var(--npc-iws-side-padding);
		}

		.npc-iws-title {
			margin: 0 0 22px;
			text-align: center;
		}

		.npc-iws-shell {
			display: grid;
			grid-template-columns: 38px minmax(0, 1fr) 38px;
			align-items: center;
			column-gap: 38px;
			width: 100%;
		}

		.npc-iws-track {
			display: flex;
			gap: var(--npc-iws-gap);
			overflow-x: auto;
			overflow-y: hidden;
			scroll-snap-type: x mandatory;
			scroll-behavior: smooth;
			-webkit-overflow-scrolling: touch;
			scrollbar-width: none;
			padding: 6px 2px 18px;
		}

		.npc-iws-track::-webkit-scrollbar {
			display: none;
		}

		.npc-iws-card {
			flex: 0 0 calc((100% - (var(--npc-iws-gap) * (var(--npc-iws-cols) - 1))) / var(--npc-iws-cols));
			scroll-snap-align: start;
			background: #ffffff;
			border: 1px solid rgba(0, 0, 0, 0.07);
			border-radius: 20px;
			overflow: hidden;
			box-shadow: 0 12px 30px rgba(0, 0, 0, 0.08);
			transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
		}

		.npc-iws-card:hover {
			transform: translateY(-4px);
			border-color: rgba(200, 16, 46, 0.25);
			box-shadow: 0 18px 40px rgba(0, 0, 0, 0.12);
		}

		.npc-iws-image-wrap {
			width: 100%;
			aspect-ratio: 1 / 1;
			background: #f4f4f4;
			overflow: hidden;
		}

		.npc-iws-image {
			display: block;
			width: 100%;
			height: 100%;
			object-fit: cover;
			transition: transform 0.28s ease;
		}

		.npc-iws-card:hover .npc-iws-image {
			transform: scale(1.035);
		}

		.npc-iws-image-placeholder {
			display: flex;
			align-items: center;
			justify-content: center;
			width: 100%;
			height: 100%;
			font-size: 54px;
			font-weight: 700;
			color: #e30613;
			background: #f4f4f4;
		}

		.npc-iws-card-title {
			margin: 0;
			padding: 14px 12px 16px;
			font-size: 17px;
			line-height: 1.25;
			font-weight: 700;
			text-align: center;
			color: #111111;
		}

		.npc-iws-arrow {
			width: 38px;
			height: 38px;
			min-width: 38px;
			min-height: 38px;
			border: 0;
			border-radius: 999px;
			background: #050505;
			color: #ffffff;
			cursor: pointer;
			display: inline-flex;
			align-items: center;
			justify-content: center;
			box-shadow: none;
			padding: 0;
			opacity: 1;
			transition: color 0.18s ease, background 0.18s ease, transform 0.18s ease;
		}

		.npc-iws-arrow span {
			display: none;
		}

		.npc-iws-arrow::before {
			content: "";
			width: 18px;
			height: 18px;
			border-top: 4px solid currentColor;
			border-right: 4px solid currentColor;
			display: block;
			position: relative;
			left: 2px;
		}

		.npc-iws-prev::before {
			top: -1px;
			transform: rotate(-135deg) translate(-1px, -1px);
		}

		.npc-iws-next::before {
			left: -2px;
			transform: rotate(45deg) translate(-1px, 1px);
		}

		.npc-iws-arrow:hover:not(:disabled) {
			background: #050505;
			color: #e30613;
			transform: none;
		}

		.npc-iws-arrow:not(:hover):not(:disabled),
		.npc-iws-arrow:focus:not(:hover):not(:disabled),
		.npc-iws-arrow:active:not(:hover):not(:disabled) {
			background: #050505;
			color: #ffffff;
		}		

		.npc-iws-arrow:disabled,
		.npc-iws-arrow:disabled:hover {
			background: #b8b8b8;
			color: #ffffff;
			cursor: default;
			opacity: 1;
			box-shadow: none;
			transform: none;
		}

		@media (max-width: 1024px) {
			.npc-iws-carousel {
				--npc-iws-cols: 3;
				--npc-iws-gap: 18px;
			}
		}

		@media (max-width: 767px) {
			.npc-iws-carousel {
				--npc-iws-cols: 1;
				--npc-iws-gap: 16px;
			}

			.npc-iws-shell {
				grid-template-columns: 38px minmax(0, 1fr) 38px;
				column-gap: 8px;
			}

			.npc-iws-arrow {
				width: 38px;
				height: 38px;
			}

			.npc-iws-arrow span {
				font-size: 30px;
			}

			.npc-iws-card-title {
				font-size: 16px;
			}
		}