/* Kale Pro Deneyim Widget v1.0.0 */
.kpdw,
.kpdw *,
.kpdw *::before,
.kpdw *::after {
	box-sizing: border-box;
}

.kpdw {
	--kpdw-accent: #d71920;
	--kpdw-item-accent: #d71920;
	position: relative;
	isolation: isolate;
	width: 100%;
	max-width: 100%;
	overflow: hidden;
	background: #0b0e12;
	font-family: "Poppins", Arial, sans-serif !important;
	color: #fff;
}

.kpdw::before {
	content: "";
	position: absolute;
	z-index: -2;
	inset: 0;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	pointer-events: none;
}

.kpdw::after {
	content: "";
	position: absolute;
	z-index: -1;
	inset: 0;
	background:
		linear-gradient(90deg, rgba(5, 7, 10, 0.2), rgba(5, 7, 10, 0.04) 50%, rgba(5, 7, 10, 0.42)),
		radial-gradient(circle at 48% 12%, rgba(255, 255, 255, 0.035), transparent 38%);
	pointer-events: none;
}

.kpdw--glow .kpdw__inner::before,
.kpdw--glow .kpdw__inner::after {
	content: "";
	position: absolute;
	z-index: -1;
	width: 330px;
	height: 330px;
	border-radius: 50%;
	background: radial-gradient(circle, color-mix(in srgb, var(--kpdw-accent) 28%, transparent), transparent 68%);
	filter: blur(8px);
	opacity: 0.72;
	pointer-events: none;
}

.kpdw--glow .kpdw__inner::before {
	right: -155px;
	top: -195px;
}

.kpdw--glow .kpdw__inner::after {
	right: 15%;
	bottom: -230px;
}

.kpdw a,
.kpdw a:hover,
.kpdw a:focus,
.kpdw a:visited {
	text-decoration: none !important;
}

.kpdw button,
.kpdw a {
	font-family: inherit !important;
}

.kpdw button {
	-webkit-appearance: none;
	appearance: none;
}

.kpdw__inner {
	position: relative;
	z-index: 1;
	width: 100%;
	max-width: 1450px;
	min-height: 320px;
	margin: 0 auto;
	padding: 46px 35px;
	display: flex;
	align-items: center;
}

.kpdw__layout {
	display: flex;
	align-items: stretch;
	width: 100%;
	min-width: 0;
	gap: 34px;
}

.kpdw__intro {
	flex: 0 0 29%;
	min-width: 0;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
	text-align: left;
}

.kpdw__eyebrow,
.kpdw__title,
.kpdw__description,
.kpdw__description p,
.kpdw__card-title,
.kpdw__card-description,
.kpdw__card-description p {
	font-family: "Poppins", Arial, sans-serif !important;
}

.kpdw__eyebrow {
	margin: 0 0 12px;
	padding: 0;
	color: #d71920 !important;
	font-size: 11px;
	font-weight: 600;
	line-height: 1.4;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.kpdw__title {
	margin: 0 0 18px !important;
	padding: 0 !important;
	color: #fff !important;
	font-size: 32px;
	font-weight: 600;
	line-height: 1.28;
	letter-spacing: -0.025em;
}

.kpdw__description {
	width: 100%;
	max-width: 330px;
	margin: 0;
	padding: 0;
	color: #a6abb3 !important;
	font-size: 13px;
	font-weight: 400;
	line-height: 1.75;
}

.kpdw__description p,
.kpdw__card-description p {
	margin: 0 !important;
	padding: 0 !important;
	color: inherit !important;
	font: inherit !important;
}

.kpdw__description p + p,
.kpdw__card-description p + p {
	margin-top: 0.75em !important;
}

.kpdw__button-wrap {
	margin-top: 23px;
}

.kpdw__button {
	position: relative;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-width: 0;
	padding: 13px 19px;
	border: 0;
	border-radius: 3px;
	background-color: #d71920 !important;
	color: #fff !important;
	font-size: 12px;
	font-weight: 600;
	line-height: 1;
	letter-spacing: 0;
	text-transform: none;
	box-shadow: none;
	outline: 0;
	cursor: pointer;
	transition: transform 0.24s ease, background-color 0.24s ease, color 0.24s ease, box-shadow 0.24s ease, border-color 0.24s ease;
}

.kpdw__button:hover,
.kpdw__button:focus-visible,
.kpdw__button:visited {
	background-color: #b90f16 !important;
	color: #fff !important;
}

.kpdw__button:focus-visible,
.kpdw__card-link:focus-visible,
.kpdw__arrow:focus-visible,
.kpdw__dot:focus-visible,
.kpdw__track:focus-visible {
	outline: 2px solid var(--kpdw-accent) !important;
	outline-offset: 3px;
}

.kpdw__button-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 0;
	transition: transform 0.24s ease;
}

.kpdw__button-icon i {
	font-size: 1em;
	line-height: 1;
	color: currentColor !important;
}

.kpdw__button-icon svg {
	display: block;
	width: 1em;
	height: 1em;
	fill: currentColor !important;
}

.kpdw--button-lift .kpdw__button:hover,
.kpdw--button-lift .kpdw__button:focus-visible {
	transform: translateY(-2px);
}

.kpdw--button-slide .kpdw__button:hover .kpdw__button-icon--after,
.kpdw--button-slide .kpdw__button:focus-visible .kpdw__button-icon--after {
	transform: translateX(4px);
}

.kpdw--button-slide .kpdw__button:hover .kpdw__button-icon--before,
.kpdw--button-slide .kpdw__button:focus-visible .kpdw__button-icon--before {
	transform: translateX(-4px);
}

.kpdw--button-glow .kpdw__button:hover,
.kpdw--button-glow .kpdw__button:focus-visible {
	box-shadow: 0 0 0 1px color-mix(in srgb, var(--kpdw-accent) 50%, transparent), 0 10px 30px color-mix(in srgb, var(--kpdw-accent) 32%, transparent);
}

.kpdw__cards {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.kpdw__track {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(145px, 1fr));
	align-items: stretch;
	width: 100%;
	min-width: 0;
	outline: 0;
}

.kpdw__card {
	position: relative;
	min-width: 0;
	display: flex;
	align-items: stretch;
}

.kpdw__card:not(:first-child)::before {
	content: "";
	position: absolute;
	z-index: 2;
	left: 0;
	top: 50%;
	width: 1px;
	height: 82%;
	background: rgba(255, 255, 255, 0.1);
	transform: translateY(-50%);
	pointer-events: none;
}

.kpdw__card-inner {
	position: relative;
	width: 100%;
	min-width: 0;
	padding: 8px 26px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	background: transparent;
	border: 1px solid transparent;
	border-radius: 6px;
	transition: transform 0.25s ease, background-color 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
}

.kpdw__card:hover .kpdw__card-inner,
.kpdw__card:focus-within .kpdw__card-inner {
	background: rgba(255, 255, 255, 0.035);
	transform: translateY(-4px);
}

.kpdw__card-link {
	position: absolute;
	z-index: 5;
	inset: 0;
	border-radius: inherit;
}

.kpdw__icon {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 66px;
	height: 66px;
	margin: 0 0 15px;
	border-radius: 50%;
	background: transparent;
	color: #f4f5f6 !important;
	line-height: 0;
	transition: transform 0.28s ease, color 0.28s ease;
}

.kpdw__icon-accent {
	position: absolute;
	inset: 5px;
	border-radius: 50%;
	border: 1px solid color-mix(in srgb, var(--kpdw-item-accent) 55%, transparent);
	opacity: 0.55;
	transform: scale(0.9);
	transition: transform 0.28s ease, opacity 0.28s ease;
}

.kpdw__icon-accent::before,
.kpdw__icon-accent::after {
	content: "";
	position: absolute;
	background: var(--kpdw-item-accent);
	border-radius: 999px;
	opacity: 0.8;
}

.kpdw__icon-accent::before {
	width: 12px;
	height: 2px;
	right: -4px;
	top: 9px;
	transform: rotate(-28deg);
}

.kpdw__icon-accent::after {
	width: 2px;
	height: 11px;
	left: 3px;
	bottom: 5px;
	transform: rotate(-28deg);
}

.kpdw__icon i {
	position: relative;
	z-index: 1;
	font-size: 34px;
	line-height: 1;
	color: currentColor !important;
}

.kpdw__icon svg {
	position: relative;
	z-index: 1;
	display: block;
	width: 34px;
	height: 34px;
	fill: currentColor !important;
}

.kpdw__card:hover .kpdw__icon,
.kpdw__card:focus-within .kpdw__icon {
	transform: translateY(-2px) scale(1.04);
}

.kpdw__card:hover .kpdw__icon-accent,
.kpdw__card:focus-within .kpdw__icon-accent {
	opacity: 0.95;
	transform: scale(1);
}

.kpdw__card-title {
	position: relative;
	z-index: 2;
	width: 100%;
	margin: 0 0 12px !important;
	padding: 0 !important;
	color: #fff !important;
	font-size: 16px;
	font-weight: 600;
	line-height: 1.45;
	letter-spacing: -0.01em;
}

.kpdw__card-description {
	position: relative;
	z-index: 2;
	width: 100%;
	margin: 0;
	padding: 0;
	color: #9da3ac !important;
	font-size: 12px;
	font-weight: 400;
	line-height: 1.75;
}

.kpdw__mobile-nav {
	display: none;
}

.kpdw__button-wrap--desktop-hidden {
	display: none;
}

@media (max-width: 1180px) {
	.kpdw__inner {
		min-height: 0;
	}

	.kpdw__layout {
		flex-direction: column;
	}

	.kpdw__intro {
		flex-basis: auto !important;
		width: 100%;
		max-width: 720px;
	}

	.kpdw__description {
		max-width: 620px;
	}

	.kpdw__track {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

@media (max-width: 900px) {
	.kpdw__track {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 12px 0;
	}

	.kpdw__card:nth-child(odd)::before {
		display: none;
	}

	.kpdw__card:nth-child(n + 3) {
		border-top: 1px solid rgba(255, 255, 255, 0.08);
	}
}

@media (max-width: 767px) {
	.kpdw {
		width: 100%;
		max-width: 100vw;
	}

	.kpdw::after {
		background:
			linear-gradient(180deg, rgba(5, 7, 10, 0.06), rgba(5, 7, 10, 0.3)),
			radial-gradient(circle at 50% 16%, rgba(255, 255, 255, 0.04), transparent 42%);
	}

	.kpdw--glow .kpdw__inner::before {
		right: -210px;
		top: -190px;
	}

	.kpdw--glow .kpdw__inner::after {
		right: -145px;
		bottom: -245px;
	}

	.kpdw__inner {
		width: 100%;
		max-width: 100%;
		min-height: 0;
		padding: 34px 18px;
	}

	.kpdw__layout {
		width: 100%;
		max-width: 100%;
		gap: 25px;
	}

	.kpdw__intro {
		width: 100%;
		max-width: 100%;
		align-items: flex-start;
	}

	.kpdw__title {
		font-size: clamp(25px, 8vw, 34px);
	}

	.kpdw__description {
		max-width: 100%;
	}

	.kpdw__button-wrap--desktop-hidden {
		display: block;
	}

	.kpdw__button-wrap--mobile-hidden {
		display: none !important;
	}

	.kpdw__cards {
		width: 100%;
		max-width: 100%;
		overflow: visible;
	}

	.kpdw--mobile-scroll .kpdw__track {
		display: flex;
		align-items: stretch;
		width: calc(100% + 18px);
		max-width: none;
		margin-right: -18px;
		padding: 2px 18px 14px 0;
		gap: 14px;
		overflow-x: auto;
		overflow-y: hidden;
		scroll-snap-type: x mandatory;
		scroll-padding-inline: 0;
		overscroll-behavior-inline: contain;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
		cursor: grab;
	}

	.kpdw--mobile-scroll .kpdw__track:active {
		cursor: grabbing;
	}

	.kpdw--mobile-scroll .kpdw__track::-webkit-scrollbar {
		display: none;
	}

	.kpdw--mobile-scroll .kpdw__card {
		flex: 0 0 var(--kpdw-mobile-card-width, 84%);
		width: var(--kpdw-mobile-card-width, 84%);
		max-width: 360px;
		min-width: 235px;
		scroll-snap-align: start;
		scroll-snap-stop: always;
		border: 0 !important;
	}

	.kpdw--mobile-scroll .kpdw__card::before {
		display: none !important;
	}

	.kpdw--mobile-scroll .kpdw__card-inner {
		min-height: 260px;
		padding: 26px 22px 24px;
		background: rgba(255, 255, 255, 0.045);
		border: 1px solid rgba(255, 255, 255, 0.08);
		border-radius: 8px;
		box-shadow: 0 12px 34px rgba(0, 0, 0, 0.16);
	}

	.kpdw--mobile-scroll .kpdw__card:hover .kpdw__card-inner {
		transform: none;
	}

	.kpdw--mobile-scroll .kpdw__card:last-child {
		margin-right: 0;
	}

	.kpdw--mobile-scroll .kpdw__mobile-nav {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 13px;
		width: 100%;
		margin-top: 4px;
	}

	.kpdw__arrow {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		flex: 0 0 38px;
		width: 38px;
		height: 38px;
		margin: 0;
		padding: 0;
		border: 1px solid rgba(255, 255, 255, 0.1) !important;
		border-radius: 50%;
		background: rgba(255, 255, 255, 0.07) !important;
		color: #fff !important;
		box-shadow: none !important;
		cursor: pointer;
		transition: opacity 0.2s ease, transform 0.2s ease, background-color 0.2s ease;
	}

	.kpdw__arrow:hover,
	.kpdw__arrow:focus-visible {
		background: rgba(255, 255, 255, 0.13) !important;
		color: #fff !important;
		transform: translateY(-1px);
	}

	.kpdw__arrow[disabled] {
		opacity: 0.35;
		cursor: default;
		transform: none;
	}

	.kpdw__arrow svg {
		display: block;
		width: 17px;
		height: 17px;
		fill: currentColor !important;
	}

	.kpdw__dots {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 7px;
		min-width: 48px;
	}

	.kpdw__dot {
		display: block;
		width: 6px;
		height: 6px;
		margin: 0;
		padding: 0;
		border: 0 !important;
		border-radius: 999px;
		background: rgba(255, 255, 255, 0.25) !important;
		box-shadow: none !important;
		cursor: pointer;
		transition: width 0.24s ease, background-color 0.24s ease, opacity 0.24s ease;
	}

	.kpdw__dot.is-active {
		width: 20px;
		background: #d71920 !important;
	}

	.kpdw:not(.kpdw--mobile-scroll) .kpdw__track {
		display: grid;
		grid-template-columns: 1fr;
		gap: 12px;
	}

	.kpdw:not(.kpdw--mobile-scroll) .kpdw__card::before {
		display: none;
	}

	.kpdw:not(.kpdw--mobile-scroll) .kpdw__card {
		border: 0 !important;
	}

	.kpdw:not(.kpdw--mobile-scroll) .kpdw__card-inner {
		background: rgba(255, 255, 255, 0.035);
		border: 1px solid rgba(255, 255, 255, 0.07);
	}
}

@media (max-width: 420px) {
	.kpdw--mobile-scroll .kpdw__card {
		flex-basis: min(var(--kpdw-mobile-card-width, 88%), 325px);
		width: min(var(--kpdw-mobile-card-width, 88%), 325px);
		min-width: 225px;
	}

	.kpdw__title {
		font-size: 25px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.kpdw *,
	.kpdw *::before,
	.kpdw *::after {
		scroll-behavior: auto !important;
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}
}
