/* =========================================================
   Pokladny Toolbox – front
   Values copied from the pokladny.online Divi sections
   (#produkty: et_pb_text_12–15, et_pb_blurb_0–3, et_pb_button_3;
    service cards: et_pb_column_3–5, et_pb_icon_0–2, et_pb_button_1)
   ========================================================= */

:root {
	--pko-yellow: #ffbf00;
	--pko-yellow-soft: #ffd044;
	--pko-gold: #de9902;
	--pko-dark: #1c1b2d;
	--pko-grey-border: #6b6b6b;
	--pko-heading: #333;
	--pko-text: #666;
	--pko-font-head: "Space Grotesk", Helvetica, Arial, Lucida, sans-serif;
	--pko-font-label: "DM Sans", Helvetica, Arial, Lucida, sans-serif;
	--pko-font-body: "Open Sans", Arial, sans-serif;
}

/* ---------- Label ("NOVINKA") ---------- */
.pko-label,
#main-content .pko-label {
	font-family: var(--pko-font-label);
	font-weight: 700;
	font-size: 14px;
	line-height: 1.4em;
	letter-spacing: .7em;
	text-transform: uppercase;
	color: var(--pko-yellow) !important;
	margin: 0 0 4px;
	padding: 0 0 10px;
}

/* ---------- Buttons ---------- */
.pko-btn,
#page-container .pko-btn {
	position: relative;
	display: inline-block;
	font-family: var(--pko-font-head) !important;
	font-weight: 700 !important;
	font-size: 14px;
	line-height: 1.7em;
	letter-spacing: .16em;
	text-transform: uppercase !important;
	text-decoration: none;
	padding: 18px 36px !important;
	border: 0 !important;
	border-radius: 100px;
	transition: all 300ms;
	cursor: pointer;
}
.pko-btn--yellow,
#page-container .pko-btn--yellow { background-color: var(--pko-yellow); color: #000 !important; }
.pko-btn--gold,
#page-container .pko-btn--gold { background-color: var(--pko-gold); color: #fff !important; }
.pko-btn--gold:hover { filter: brightness(1.06); }

/* Divi-style arrow ("5" in ETmodules) that fades in on hover */
.pko-btn--arrow::after {
	content: "5";
	font-family: ETmodules !important;
	font-weight: 400;
	font-size: 1.6em;
	line-height: 1;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	margin-left: -.6em;
	opacity: 0;
	transition: all 300ms;
}
.pko-btn--arrow:hover::after,
.pko-product__link:hover .pko-btn--arrow::after { opacity: 1; margin-left: -.2em; }

/* per-card "Zjistit více" in the product carousel (bottoms aligned) */
.pko-product__footer { display: block; margin-top: auto; padding-top: 24px; text-align: center; }

/* ---------- Carousel ---------- */
.pko-carousel {
	--pko-gap: 2%;
	--pko-pv: var(--pko-per-view, 4);
	position: relative;
}
.pko-carousel--news { --pko-gap: 3%; }

.pko-carousel__track {
	display: flex;
	gap: var(--pko-gap);
	overflow-x: auto;
	overflow-y: hidden;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
	/* room for hover lift without clipping */
	padding: 12px 0 16px;
	margin: -12px 0 -16px;
}
.pko-carousel__track::-webkit-scrollbar { display: none; }

.pko-carousel__item {
	flex: 0 0 calc((100% - (var(--pko-pv) - 1) * var(--pko-gap)) / var(--pko-pv));
	min-width: 0;
	scroll-snap-align: start;
}

.pko-carousel__arrow {
	position: absolute;
	top: 50%;
	z-index: 3;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	margin-top: -22px;
	padding: 0 0 4px;
	border: 0;
	border-radius: 50%;
	background: var(--pko-yellow);
	color: #000;
	font: 700 30px/1 var(--pko-font-head);
	cursor: pointer;
	box-shadow: 0 6px 18px rgba(0, 0, 0, .25);
	transition: opacity 300ms, transform 300ms;
}
.pko-carousel__arrow[hidden] { display: none; }
.pko-carousel__arrow:hover { transform: scale(1.08); }
.pko-carousel__arrow:disabled { opacity: .3; cursor: default; transform: none; }
.pko-carousel__arrow--prev { left: -64px; }
.pko-carousel__arrow--next { right: -64px; }

/* ---------- Products (copy of #produkty row) ---------- */
.pko-products__footer { margin-top: 60px; }

.pko-product { position: relative; }

a.pko-product__link,
#main-content a.pko-product__link {
	display: flex;
	flex-direction: column;
	height: 100%;
	color: #fff !important;
	text-decoration: none;
}

.pko-product__title,
#main-content .pko-product__title {
	display: flex;
	align-items: flex-end;
	min-height: 2.4em;
	margin: -8px 0 0;
	padding: 0 0 10px;
	font-family: var(--pko-font-head);
	font-weight: 700;
	font-size: 41px;
	line-height: 1.2em;
	text-align: left;
	color: #fff !important;
}

.pko-product__media {
	display: block;
	overflow: hidden;
	margin: 0 0 30px;
	border: 3px solid var(--pko-grey-border);
	border-radius: 50px;
	background-color: #fff;
	aspect-ratio: 1736 / 1695;
	transition: transform 300ms, border-color 300ms;
}
.pko-product.is-highlight .pko-product__media {
	border-width: 4px;
	border-color: var(--pko-yellow);
}
.pko-product__link:hover .pko-product__media { transform: translateY(-6px); }
.pko-product:not(.is-highlight) .pko-product__link:hover .pko-product__media { border-color: var(--pko-yellow); }

.pko-product__media img.pko-product__image {
	display: block;
	width: 100%;
	height: 100%;
	max-width: 100%;
	object-fit: contain;
	border-radius: 0;
}
.pko-product__placeholder { display: block; width: 100%; height: 100%; background: #f1f1f4; }

.pko-product__desc {
	display: block;
	font-family: var(--pko-font-head);
	font-weight: 500;
	font-size: 18px;
	line-height: 23.8px;
	text-align: center;
	color: #fff;
}
.pko-product__desc strong,
.pko-product__desc b { font-weight: 700; color: #fff; }

.pko-product__price {
	display: block;
	margin-top: 14px;
	font-family: var(--pko-font-head);
	font-weight: 700;
	font-size: 20px;
	line-height: 1.3;
	text-align: center;
	color: var(--pko-yellow);
}

/* ---------- News cards (copy of the service cards) ---------- */
.pko-news {
	position: relative;
	display: flex;
	flex-direction: column;
	padding: 60px 20px 30px;
	border-radius: 10px;
	overflow: hidden;
	background-color: #fff;
	transition: transform 300ms, box-shadow 300ms;
}
.pko-news--gradient { background-image: linear-gradient(121deg, #fff 0%, var(--pko-yellow-soft) 100%); }
.pko-news--yellow { background-color: var(--pko-yellow-soft); }
.pko-news:hover { transform: translateY(-6px); box-shadow: 0 14px 30px rgba(0, 0, 0, .25); }

.pko-news__icon { margin: 0 0 30px; line-height: 0; }

.pko-icon {
	display: inline-block;
	font-family: "PKO FA", FontAwesome;
	font-weight: 900;
	font-style: normal;
	font-size: 47px;
	line-height: 1;
	color: #000;
	speak: never;
	-webkit-font-smoothing: antialiased;
}
img.pko-icon--img { width: 47px; height: 47px; object-fit: contain; }

.pko-news__title,
#main-content .pko-news__title {
	margin: 0;
	padding: 0 0 10px;
	font-family: var(--pko-font-head);
	font-weight: 700;
	font-size: 20px;
	line-height: 1.4em;
	color: var(--pko-heading);
}
.pko-news--yellow .pko-news__title { color: #000; }

a.pko-news__link,
#main-content a.pko-news__link { color: inherit !important; text-decoration: none; }
/* whole card is clickable */
a.pko-news__link::after { content: ""; position: absolute; inset: 0; z-index: 1; }

.pko-news__text p,
#main-content .pko-news__text p {
	margin: 0;
	padding: 0;
	font-family: var(--pko-font-body);
	font-size: 16px;
	line-height: 1.8em;
	color: var(--pko-text);
}

.pko-news__footer { position: relative; z-index: 2; margin-top: auto; padding-top: 24px; }

/* ---------- Page templates ---------- */
.pko-main { background: #fff; }

.pko-container { width: 80%; max-width: 1080px; margin: 0 auto; }
.pko-container--narrow { max-width: 800px; }

.pko-hero {
	position: relative;
	padding: 60px 0 90px;
	background-color: var(--pko-dark);
	background-size: cover;
	background-position: center;
	color: #fff;
	overflow: hidden;
}
.pko-hero--related { padding: 60px 0 80px; }

a.pko-back,
#main-content a.pko-back {
	display: inline-block;
	margin-bottom: 40px;
	font-family: var(--pko-font-label);
	font-weight: 700;
	font-size: 13px;
	letter-spacing: .2em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--pko-yellow) !important;
}
a.pko-back:hover { opacity: .8; }

.pko-hero__title,
#main-content .pko-hero__title,
.pko-product-detail__title,
#main-content .pko-product-detail__title {
	margin: 0;
	padding: 0 0 20px;
	font-family: var(--pko-font-head);
	font-weight: 700;
	font-size: 52px;
	line-height: 1.2em;
	color: #fff !important;
}
.pko-hero__icon { margin-bottom: 24px; line-height: 0; }
.pko-hero__icon .pko-icon { font-size: 60px; color: var(--pko-yellow); }
.pko-hero__icon img.pko-icon--img { width: 60px; height: 60px; }

/* product detail */
.pko-product-detail {
	display: grid;
	grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
	gap: 60px;
	align-items: center;
}
.pko-product-detail__media .pko-product__media { margin: 0; }

.pko-product-detail__short {
	margin: 0 0 24px;
	padding: 0;
	font-family: var(--pko-font-head);
	font-weight: 500;
	font-size: 20px;
	line-height: 1.5;
	color: #fff;
}
.pko-product-detail__short strong { color: #fff; }

.pko-product-detail__price {
	margin: 0 0 30px;
	padding: 0;
	font-family: var(--pko-font-head);
	font-weight: 700;
	font-size: 34px;
	line-height: 1.2;
	color: var(--pko-yellow);
}
.pko-product-detail__price small {
	margin-left: 6px;
	font-size: 14px;
	font-weight: 500;
	color: rgba(255, 255, 255, .7);
}

/* article / product body */
.pko-body { padding: 70px 0 90px; background: #fff; }

.pko-content,
.pko-content p,
.pko-content li {
	font-family: var(--pko-font-body);
	font-size: 16px;
	line-height: 1.8em;
	color: var(--pko-text);
}
.pko-content p { padding: 0 0 1em; }
.pko-content h2,
.pko-content h3,
.pko-content h4 {
	font-family: var(--pko-font-head);
	font-weight: 700;
	line-height: 1.3em;
	color: var(--pko-heading);
	padding: 20px 0 10px;
}
.pko-content h2 { font-size: 32px; }
.pko-content h3 { font-size: 24px; }
.pko-content h4 { font-size: 20px; }
.pko-content ul,
.pko-content ol { padding: 0 0 1em 20px; }
.pko-content ul { list-style: disc; }
.pko-content a:not(.pko-btn) { color: var(--pko-gold); }
.pko-content img { border-radius: 10px; height: auto; }
.pko-content__image { margin: 0 0 30px; }
.pko-content__image img { display: block; width: 100%; }
.pko-content__cta { padding-top: 20px !important; }

/* product detail – description card + specs */
.pko-body--product {
	background: #f4f4f7;
	padding: 80px 0 90px;
}

.pko-label.pko-label--dark,
#main-content .pko-label.pko-label--dark { color: var(--pko-gold) !important; margin-bottom: 14px; }

.pko-desc-card {
	padding: 50px 56px;
	border-radius: 24px;
	background: #fff;
	box-shadow: 0 20px 50px rgba(28, 27, 45, .08);
}

.pko-content--product {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 18px 24px;
}
/* anything that isn't a plain paragraph spans the full width */
.pko-content--product > * { grid-column: 1 / -1; margin: 0; }
.pko-content--product > p:not(:first-child) { grid-column: auto; }

.pko-content.pko-content--product p,
#main-content .pko-content--product p {
	margin: 0;
	padding: 20px 24px;
	border-left: 4px solid var(--pko-yellow);
	border-radius: 14px;
	background: #f7f7fa;
	font-family: var(--pko-font-body);
	font-size: 16px;
	line-height: 1.75em;
	color: #4a4a57;
}
/* first paragraph = lead */
.pko-content.pko-content--product > p:first-child,
#main-content .pko-content--product > p:first-child {
	padding: 0 0 26px;
	margin-bottom: 8px;
	border: 0;
	border-bottom: 1px solid #ececf1;
	border-radius: 0;
	background: none;
	font-family: var(--pko-font-head);
	font-weight: 500;
	font-size: 24px;
	line-height: 1.45;
	color: var(--pko-dark);
}

.pko-content .pko-sub {
	display: block;
	margin: 0 0 6px;
	font-family: var(--pko-font-label);
	font-weight: 700;
	font-size: 12px;
	line-height: 1.4;
	letter-spacing: .2em;
	text-transform: uppercase;
	color: var(--pko-gold);
}
.pko-content--product strong:not(.pko-sub) { color: var(--pko-dark); }

.pko-specs { margin-top: 50px; }
.pko-specs__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 20px;
}
.pko-specs__grid--1 { grid-template-columns: minmax(0, 1fr); max-width: 360px; }
.pko-specs__grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.pko-specs__grid--3,
.pko-specs__grid--5,
.pko-specs__grid--6 { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.pko-spec {
	display: flex;
	flex-direction: column;
	gap: 22px;
	padding: 28px 26px 30px;
	border-radius: 20px;
	background: var(--pko-dark);
	box-shadow: 0 16px 36px rgba(28, 27, 45, .18);
	transition: transform 300ms;
}
.pko-spec:hover { transform: translateY(-6px); }

.pko-spec__icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 54px;
	height: 54px;
	border-radius: 50%;
	background: var(--pko-yellow);
	font-family: "PKO FA", FontAwesome;
	font-weight: 900;
	font-size: 22px;
	line-height: 1;
	color: #000;
}
.pko-spec__text { display: flex; flex-direction: column; gap: 6px; }
.pko-spec__label {
	font-family: var(--pko-font-label);
	font-weight: 700;
	font-size: 12px;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, .6);
}
.pko-spec__value {
	font-family: var(--pko-font-head);
	font-weight: 700;
	font-size: 19px;
	line-height: 1.35;
	color: #fff;
}

/* archive */
.pko-news-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 30px;
	margin-top: 20px;
}
.pko-empty { color: rgba(255, 255, 255, .8); font-size: 18px; }

.pko-pagination { margin-top: 50px; }
.pko-pagination ul { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0; padding: 0; }
.pko-pagination li { padding: 0; }
.pko-pagination .page-numbers {
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	height: 44px;
	padding: 0 10px;
	border-radius: 100px;
	background: rgba(255, 255, 255, .08);
	font-family: var(--pko-font-head);
	font-weight: 700;
	font-size: 16px;
	color: #fff;
	text-decoration: none;
}
.pko-pagination .page-numbers.current,
.pko-pagination a.page-numbers:hover { background: var(--pko-yellow); color: #000; }

/* ---------- Responsive (Divi breakpoints) ---------- */
@media (max-width: 980px) {
	.pko-carousel { --pko-pv: min(var(--pko-per-view, 4), 2); }
	.pko-product__title, #main-content .pko-product__title { font-size: 32px; }
	.pko-news__title, #main-content .pko-news__title { font-size: 16px; }
	.pko-news__text p, #main-content .pko-news__text p { font-size: 15px; }
	.pko-carousel__arrow--prev { left: -54px; }
	.pko-carousel__arrow--next { right: -54px; }

	.pko-hero__title, #main-content .pko-hero__title,
	.pko-product-detail__title, #main-content .pko-product-detail__title { font-size: 40px; }
	.pko-product-detail { grid-template-columns: 1fr; gap: 40px; }
	.pko-product-detail__media { max-width: 420px; }
	.pko-news-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.pko-specs__grid,
	.pko-specs__grid--3,
	.pko-specs__grid--5,
	.pko-specs__grid--6 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.pko-desc-card { padding: 40px 36px; }
}

@media (max-width: 767px) {
	.pko-carousel__item { flex-basis: 86%; }
	.pko-product__title, #main-content .pko-product__title { font-size: 40px; }
	.pko-news__title, #main-content .pko-news__title { font-size: 18px; }
	.pko-news__text p, #main-content .pko-news__text p { font-size: 14px; }
	.pko-carousel__arrow { width: 36px; height: 36px; margin-top: -18px; font-size: 24px; }
	.pko-carousel__arrow--prev { left: -18px; }
	.pko-carousel__arrow--next { right: -18px; }
	.pko-products__footer { margin-top: 40px; text-align: center; }
	.pko-btn--gold, #page-container .pko-btn--gold { font-size: 12px; }

	.pko-hero { padding: 40px 0 60px; }
	.pko-hero__title, #main-content .pko-hero__title,
	.pko-product-detail__title, #main-content .pko-product-detail__title { font-size: 28px; }
	.pko-product-detail__price { font-size: 26px; }
	.pko-news-grid { grid-template-columns: 1fr; }
	.pko-body { padding: 40px 0 60px; }
	.pko-body--product { padding: 40px 0 60px; }
	.pko-desc-card { padding: 28px 20px; border-radius: 18px; }
	.pko-content--product { grid-template-columns: 1fr; }
	.pko-content.pko-content--product > p:first-child,
	#main-content .pko-content--product > p:first-child { font-size: 19px; }
	.pko-specs { margin-top: 36px; }
	.pko-specs__grid,
	.pko-specs__grid--2,
	.pko-specs__grid--3,
	.pko-specs__grid--5,
	.pko-specs__grid--6 { grid-template-columns: 1fr; }
	.pko-spec { flex-direction: row; align-items: center; gap: 18px; padding: 20px; }
	.pko-spec__icon { flex: 0 0 48px; width: 48px; height: 48px; font-size: 20px; }
	.pko-spec__value { font-size: 17px; }
}
