:root {
	--psk-dark: #123b4c;
	--psk-dark-2: #0b2e3d;
	--psk-blue: #38a8cd;
	--psk-cyan: #86d9eb;
	--psk-light: #f4f8fa;
	--psk-line: rgba(18, 59, 76, .16);
}

.psk-klen-card-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 22px;
}

.kp-products__grid > .psk-klen-card-grid {
	display: contents;
}

.psk-klen-card {
	min-width: 0;
	overflow: hidden;
	border: 1px solid var(--psk-line);
	border-radius: 10px;
	background: #fff;
	box-shadow: 0 12px 32px rgba(8, 42, 57, .08);
	transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

.psk-klen-card:hover {
	transform: translateY(-4px);
	border-color: rgba(56,168,205,.52);
	box-shadow: 0 20px 48px rgba(8,42,57,.14);
}

.psk-klen-card__media {
	display: block;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	background: var(--psk-dark);
}

.psk-klen-card__media img,
.psk-klen-item__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: var(--psk-focus, center center);
	transition: transform .35s ease;
}

.psk-klen-card--product .psk-klen-card__media {
	background: #f6f9fa;
}

.psk-klen-card--product .psk-klen-card__media img {
	object-fit: contain;
	padding: 18px;
}

.psk-klen-card:hover .psk-klen-card__media img {
	transform: scale(1.035);
}

.psk-klen-card__placeholder {
	display: flex;
	flex-direction: column;
	gap: 14px;
	width: 100%;
	height: 100%;
	align-items: center;
	justify-content: center;
	color: rgba(255,255,255,.7);
	font-weight: 700;
	letter-spacing: .12em;
	text-align: center;
	text-transform: uppercase;
}

.psk-klen-card__placeholder i {
	display: block;
	width: 60px;
	height: 60px;
	border: 2px solid rgba(134,217,235,.75);
	background: linear-gradient(135deg, transparent 46%, rgba(134,217,235,.9) 47%, rgba(134,217,235,.9) 53%, transparent 54%);
	transform: rotate(45deg);
}

.psk-klen-card__placeholder b {
	font-size: 12px;
}

.psk-klen-card__body {
	padding: 22px;
}

.psk-klen-card__model,
.psk-klen-eyebrow {
	margin-bottom: 8px;
	color: #1785a8;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
}

.psk-klen-card h3 {
	margin: 0 0 12px;
	color: var(--psk-dark);
	font-size: clamp(20px, 2vw, 25px);
	line-height: 1.15;
}

.psk-klen-card h3 a {
	color: inherit;
	text-decoration: none;
}

.psk-klen-card p {
	margin: 0 0 16px;
	color: #536873;
	line-height: 1.55;
}

.psk-klen-card__link {
	color: #087b9f;
	font-weight: 700;
	text-decoration: none;
}

.psk-klen-category-track {
	display: grid;
	grid-auto-flow: column;
	grid-template-rows: repeat(2, minmax(52px, auto));
	grid-auto-columns: minmax(230px, 1fr);
	gap: 12px;
	overflow-x: auto;
	padding: 2px 2px 16px;
	scroll-snap-type: x proximity;
	scrollbar-color: var(--psk-blue) #e6eff2;
	-webkit-overflow-scrolling: touch;
}

.psk-klen-category-track a {
	display: flex;
	align-items: center;
	padding: 13px 16px;
	border: 1px solid var(--psk-line);
	background: #fff;
	color: var(--psk-dark);
	font-weight: 700;
	line-height: 1.25;
	text-decoration: none;
	scroll-snap-align: start;
}

.psk-klen-category-track a:hover,
.psk-klen-category-track a:focus-visible {
	border-color: var(--psk-blue);
	background: #eaf8fc;
}

.psk-klen-item {
	color: var(--psk-dark);
	overflow: clip;
}

.psk-klen-item__breadcrumb {
	display: flex;
	width: min(1400px, calc(100% - 48px));
	margin: 0 auto;
	padding: 22px 0;
	gap: 10px;
	align-items: center;
	color: #6c7f89;
	font-size: 13px;
	white-space: nowrap;
	overflow-x: auto;
}

.psk-klen-item__breadcrumb a {
	color: #177e9f;
	font-weight: 700;
	text-decoration: none;
}

.psk-klen-item__hero {
	display: grid;
	grid-template-columns: minmax(0, 1.08fr) minmax(390px, .92fr);
	width: min(1400px, 100%);
	min-height: 600px;
	margin: 0 auto;
	background: var(--psk-dark);
	color: #fff;
	box-shadow: 0 28px 70px rgba(5,32,44,.16);
}

.psk-klen-item__media {
	min-height: 500px;
	overflow: hidden;
}

.psk-klen-item--product .psk-klen-item__media {
	background: #f7f9fa;
}

.psk-klen-item--product .psk-klen-item__media img {
	object-fit: contain;
	padding: clamp(24px, 4vw, 64px);
}

.psk-klen-item__intro {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
	padding: clamp(36px, 6vw, 84px);
}

.psk-klen-item__intro h1 {
	margin: 0 0 18px;
	color: #fff;
	font-size: clamp(40px, 5vw, 72px);
	line-height: .98;
}

.psk-klen-item__model {
	margin-bottom: 10px;
	color: var(--psk-cyan);
	font-weight: 700;
}

.psk-klen-item__category {
	margin-bottom: 18px;
	color: rgba(255,255,255,.72);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.psk-klen-item__lead {
	max-width: 650px;
	margin: 0 0 28px;
	color: rgba(255,255,255,.82);
	font-size: 19px;
	line-height: 1.55;
}

.psk-klen-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 52px;
	padding: 13px 24px;
	background: var(--psk-blue);
	color: #fff;
	font-weight: 700;
	text-decoration: none;
	transition: transform .2s ease, background .2s ease, color .2s ease;
}

.psk-klen-button:hover,
.psk-klen-button:focus-visible {
	transform: translateY(-2px);
	background: #188db4;
	color: #fff;
}

.psk-klen-button--ghost {
	border: 1px solid rgba(255,255,255,.42);
	background: transparent;
}

.psk-klen-item__actions,
.psk-services-hero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

.psk-klen-item__section {
	width: min(1180px, calc(100% - 48px));
	margin: 0 auto;
	padding: 82px 0;
	border-bottom: 1px solid var(--psk-line);
}

.psk-klen-item__section h2 {
	margin: 0 0 30px;
	font-size: clamp(30px, 4vw, 48px);
	line-height: 1.05;
}

.psk-klen-item__content {
	max-width: 920px;
	font-size: 19px;
	line-height: 1.7;
}

.psk-klen-item__content h2:not(:first-of-type),
.psk-klen-item__content h3 {
	margin-top: 44px;
}

.psk-klen-advantages {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px 28px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.psk-klen-advantages li {
	position: relative;
	padding: 18px 18px 18px 44px;
	background: var(--psk-light);
}

.psk-klen-advantages li::before {
	position: absolute;
	top: 20px;
	left: 18px;
	color: var(--psk-blue);
	content: '✓';
	font-weight: 800;
}

.psk-klen-specs {
	margin: 0;
	border-top: 1px solid var(--psk-line);
}

.psk-klen-specs > div {
	display: grid;
	grid-template-columns: minmax(180px, .45fr) 1fr;
	gap: 25px;
	padding: 17px 0;
	border-bottom: 1px solid var(--psk-line);
}

.psk-klen-specs dt {
	color: #657985;
}

.psk-klen-specs dd {
	margin: 0;
	font-weight: 700;
}

.psk-klen-gallery {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 18px;
}

.psk-klen-gallery img {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
}

.psk-klen-video {
	position: relative;
	overflow: hidden;
	padding-top: 56.25%;
	background: #000;
	border-radius: 10px;
	box-shadow: 0 26px 64px rgba(5,32,44,.22);
}

.psk-klen-video iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

.psk-klen-item__section--video {
	width: min(1400px, calc(100% - 48px));
}

.psk-klen-video__note {
	margin: 14px 0 0;
	color: #6b7e88;
	font-size: 13px;
}

.psk-klen-item__cta {
	display: flex;
	width: min(1400px, calc(100% - 48px));
	margin: 72px auto;
	padding: clamp(32px, 5vw, 64px);
	align-items: center;
	justify-content: space-between;
	gap: 28px;
	background: linear-gradient(135deg, var(--psk-dark-2), var(--psk-dark));
	color: #fff;
}

.psk-klen-item__cta h2 {
	max-width: 760px;
	margin: 6px 0 0;
	color: #fff;
	font-size: clamp(28px, 4vw, 48px);
	line-height: 1.06;
}

.psk-services-page {
	color: var(--psk-dark);
	overflow: clip;
}

.psk-services-hero {
	padding: clamp(82px, 10vw, 150px) 24px;
	background:
		linear-gradient(110deg, rgba(7,40,55,.98), rgba(18,59,76,.9)),
		radial-gradient(circle at 78% 22%, rgba(56,168,205,.42), transparent 34%);
	color: #fff;
}

.psk-services-hero__inner {
	width: min(1180px, 100%);
	margin: 0 auto;
}

.psk-services-hero h1 {
	max-width: 980px;
	margin: 12px 0 24px;
	color: #fff;
	font-size: clamp(48px, 7vw, 92px);
	line-height: .94;
	letter-spacing: -.035em;
}

.psk-services-hero p {
	max-width: 760px;
	margin: 0 0 32px;
	color: rgba(255,255,255,.8);
	font-size: clamp(18px, 2vw, 23px);
	line-height: 1.55;
}

.psk-services-section {
	width: min(1180px, calc(100% - 48px));
	margin: 0 auto;
	padding: 84px 0;
}

.psk-services-intro {
	display: grid;
	grid-template-columns: 1.05fr .95fr;
	gap: clamp(36px, 7vw, 100px);
	align-items: end;
	border-bottom: 1px solid var(--psk-line);
}

.psk-services-section h2 {
	margin: 8px 0 0;
	font-size: clamp(34px, 5vw, 58px);
	line-height: 1.04;
}

.psk-services-intro > p {
	margin: 0;
	color: #536873;
	font-size: 19px;
	line-height: 1.7;
}

.psk-services-heading {
	margin-bottom: 36px;
}

.psk-services-catalog .psk-klen-card-grid {
	grid-template-columns: repeat(3, minmax(0,1fr));
}

.psk-services-process {
	border-top: 1px solid var(--psk-line);
}

.psk-services-process ol {
	display: grid;
	grid-template-columns: repeat(4, minmax(0,1fr));
	margin: 38px 0 0;
	padding: 0;
	gap: 1px;
	background: var(--psk-line);
	list-style: none;
}

.psk-services-process li {
	min-width: 0;
	padding: 28px;
	background: #fff;
}

.psk-services-process li > span {
	display: block;
	margin-bottom: 32px;
	color: var(--psk-blue);
	font-size: 34px;
	font-weight: 300;
}

.psk-services-process strong {
	display: block;
	margin-bottom: 10px;
	font-size: 18px;
}

.psk-services-process p {
	margin: 0;
	color: #627681;
	line-height: 1.55;
}

.psk-klen-press-gallery {
	display: grid;
	grid-template-columns: repeat(2, minmax(0,1fr));
	gap: 18px;
	padding: 0 0 72px;
}

.psk-klen-press-gallery figure {
	margin: 0;
	overflow: hidden;
	background: #fff;
}

.psk-klen-press-gallery img {
	display: block;
	width: 100%;
	aspect-ratio: 3 / 2;
	object-fit: cover;
}

.psk-klen-press-gallery figcaption {
	padding: 12px 0;
	color: #647780;
	font-size: 12px;
}

.psk-klen-empty {
	padding: 22px;
	border: 1px dashed var(--psk-line);
	background: var(--psk-light);
	color: #536873;
}

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

	.psk-klen-item__hero {
		grid-template-columns: 1fr;
	}

	.psk-klen-item__intro {
		padding: 44px 28px 52px;
	}

	.psk-services-intro {
		grid-template-columns: 1fr;
		align-items: start;
	}

	.psk-services-catalog .psk-klen-card-grid,
	.psk-services-process ol {
		grid-template-columns: repeat(2, minmax(0,1fr));
	}
}

@media (max-width: 600px) {
	.psk-klen-card-grid,
	.psk-klen-advantages,
	.psk-klen-gallery {
		grid-template-columns: 1fr;
	}

	.psk-klen-category-track {
		grid-auto-columns: minmax(190px, 78vw);
	}

	.psk-klen-item__hero {
		min-height: 0;
	}

	.psk-klen-item__media {
		min-height: 300px;
		aspect-ratio: 4 / 3;
	}

	.psk-klen-item__intro h1 {
		font-size: clamp(36px, 12vw, 54px);
	}

	.psk-klen-item__section {
		width: min(100% - 28px, 1160px);
		padding: 48px 0;
	}

	.psk-klen-item__breadcrumb,
	.psk-klen-item__section--video,
	.psk-klen-item__cta,
	.psk-services-section {
		width: calc(100% - 28px);
	}

	.psk-klen-item__cta {
		margin: 42px auto;
		padding: 28px 22px;
		align-items: flex-start;
		flex-direction: column;
	}

	.psk-klen-item__actions,
	.psk-services-hero__actions {
		width: 100%;
		flex-direction: column;
	}

	.psk-klen-button {
		width: 100%;
	}

	.psk-services-hero {
		padding: 64px 18px;
	}

	.psk-services-hero h1 {
		font-size: clamp(42px, 13vw, 62px);
	}

	.psk-services-section {
		padding: 54px 0;
	}

	.psk-services-catalog .psk-klen-card-grid,
	.psk-services-process ol,
	.psk-klen-press-gallery {
		grid-template-columns: 1fr;
	}

	.psk-services-process li {
		padding: 24px;
	}

	.psk-klen-specs > div {
		grid-template-columns: 1fr;
		gap: 5px;
	}
}

body.psk-page-about .ko-hero,body.psk-page-about .ko-photo{background-image:url("https://klen-m.by/wp-content/uploads/2026/08/office-life-director-at-desk.jpg")!important;background-position:center;background-size:cover}
body.psk-page-about .ko-hero{background-color:#123b4c!important;background-image:linear-gradient(135deg,#122f43 0%,#214c67 55%,#327b9d 100%)!important}body.psk-page-about .ko-hero::before{position:absolute!important;top:-210px!important;right:-90px!important;left:auto!important;width:520px!important;height:520px!important;border:1px solid rgba(255,255,255,.13)!important;border-radius:50%!important;background:transparent!important;box-shadow:0 0 0 86px rgba(255,255,255,.035),0 0 0 172px rgba(255,255,255,.024)!important;content:""!important}body.psk-page-about .ko-photo{background-image:url("https://klen-m.by/wp-content/uploads/2026/08/codex-clipboard-3ec813d8-753a-4408-bac8-c7af796ac558.png")!important;background-position:center!important;background-size:cover!important}
body.psk-page-about .ko-photo{background-image:url("https://klen-m.by/wp-content/uploads/2026/08/codex-clipboard-3ec813d8-753a-4408-bac8-c7af796ac558.png")!important;background-position:center!important;background-size:cover!important}


/* Product cards: preserve equal media boxes and show every image without cropping. */
body .psk-klen-card--product .psk-klen-card__media {
	background: #fff;
}

body .psk-klen-card--product .psk-klen-card__media img {
	object-fit: contain;
	object-position: center center;
	background: #fff;
}

body .psk-klen-card--product:hover .psk-klen-card__media img {
	transform: none;
}


/* Product cards: constrain portrait and landscape images to the fixed media frame. */
body .psk-klen-card--product .psk-klen-card__media img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    box-sizing: border-box !important;
    object-fit: contain !important;
    object-position: center center !important;
    padding: 18px !important;
    margin: 0 !important;
}


/* Product cards: align actions at the bottom while preserving full text. */
body .psk-klen-card--product {
    display: flex;
    flex-direction: column;
}

body .psk-klen-card--product .psk-klen-card__media {
    flex: 0 0 auto;
    width: 100%;
}

body .psk-klen-card--product .psk-klen-card__body {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    width: 100%;
}

body .psk-klen-card--product .psk-klen-card__actions {
    margin-top: auto;
}
