/* DomoradzkiLab – Katalog prac. Autor: PRZ · joost.pl (https://joost.pl).
   Paleta i krój spójne z motywem (Kadence): granat #182033, beż #c6b099, Geologica. */

.dlk,
.dlk-hero,
.dlk-cta,
.dlk-head {
	--dlk-bg: #182033;
	--dlk-bg-deep: #111827;
	--dlk-panel-1: #222d48;
	--dlk-panel-2: #1a2339;
	--dlk-gold: #c6b099;
	--dlk-gold-2: #92806c;
	--dlk-ink: #f1f1f1;
	--dlk-ink-2: #d8d8d8;
	--dlk-mute: #a4abbb;
	--dlk-line: rgba(198, 176, 153, .2);
	--dlk-line-2: rgba(198, 176, 153, .45);
	--dlk-ease: cubic-bezier(.2, .7, .2, 1);
	--dlk-pad: clamp(18px, 4vw, 56px);
	--dlk-w: var(--global-content-width, 1290px); /* szerokość treści jak w pozostałych podstronach (Kadence) */
	--dlk-wp: calc(var(--dlk-w) + 2 * var(--dlk-pad));
	--dlk-tlo: url('/wp-content/uploads/2025/03/tlo.jpg');
}
/* modal jest w top-layer, ale nadal potomkiem .dlk – zmienne dziedziczą */

/* Kadence: strona katalogu pełna szerokość, bez tytułu i odstępów */
.dlk-page .content-container.site-container,
.dlk-page .entry-content-wrap,
.dlk-page .content-wrap {
	max-width: none;
	padding-left: 0;
	padding-right: 0;
}
.dlk-page .entry-content > .alignfull,
.dlk-page .entry-content > .dlk {
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	max-width: 100vw;
	width: 100vw;
}
.dlk-page .content-area { margin-top: 0; margin-bottom: 0; }
.dlk-page { overflow-x: clip; }

/* ============================================================ HERO */
.dlk-hero {
	position: relative;
	isolation: isolate;
	color: var(--dlk-ink-2);
	background:
		linear-gradient(180deg, rgba(24, 32, 51, .55) 0%, rgba(24, 32, 51, .15) 45%, var(--dlk-bg) 100%),
		radial-gradient(60% 70% at 78% 52%, rgba(198, 176, 153, .13), transparent 70%),
		url('/wp-content/uploads/2025/03/tlo.jpg') 70% 40% / cover no-repeat,
		var(--dlk-bg);
	box-sizing: border-box;
	padding: max(190px, 16vh) var(--dlk-pad) clamp(48px, 8vh, 96px) !important; /* pod przezroczystym nagłówkiem */
	min-height: min(92svh, 860px);
	display: flex;
	align-items: center;
}
.dlk-hero > .wp-block-group__inner-container,
.dlk-hero > .wp-block-cover__inner-container {
	box-sizing: border-box;
	width: 100%;
	max-width: var(--dlk-w);
	margin-left: auto;
	margin-right: auto;
	padding-left: 0 !important;
	padding-right: 0 !important;
	position: relative;
	z-index: 3;
}
/* hero jako blok Okładka z filmem w tle (pętla, bez dźwięku); marmur z CSS zostaje jako zapas przed startem filmu */
.dlk-hero.wp-block-cover { min-height: min(92svh, 860px) !important; color: var(--dlk-ink-2); }
.dlk-hero .wp-block-cover__video-background { pointer-events: none; }
.dlk-hero.wp-block-cover::after { /* płynne przejście filmu w tło następnej sekcji + lekkie przyciemnienie pod nagłówkiem */
	content: '';
	position: absolute;
	inset: 0;
	z-index: 2;
	pointer-events: none;
	background: linear-gradient(180deg, rgba(24, 32, 51, .45) 0, rgba(24, 32, 51, 0) 24%, rgba(24, 32, 51, 0) 62%, var(--dlk-bg) 100%);
}
.dlk-hero .dlk-hero__cols {
	box-sizing: border-box;
	width: 100% !important;
	max-width: var(--dlk-w) !important;
	margin-left: auto !important;
	margin-right: auto !important;
	margin-top: 0;
	margin-bottom: 0;
	align-items: center;
	gap: clamp(24px, 5vw, 80px);
}
.dlk-hero__text { padding-left: 0; }
.dlk-hero .dlk-kicker {
	margin: 0 0 18px;
	font-size: .8rem;
	letter-spacing: .24em;
	text-transform: uppercase;
	color: var(--dlk-ink);
}
.dlk-hero h1 {
	margin: 0 0 26px;
	color: var(--dlk-gold);
	font-family: inherit;
	font-weight: 700;
	font-size: clamp(2.4rem, 1.1rem + 4vw, 5.2rem);
	line-height: 1;
	letter-spacing: -.01em;
	text-transform: uppercase;
	overflow-wrap: normal;
	word-break: normal;
	hyphens: manual;
}
.dlk-hero .dlk-lead {
	margin: 0 0 38px;
	max-width: 34em;
	font-size: clamp(1.02rem, .95rem + .35vw, 1.28rem);
	line-height: 1.65;
	color: var(--dlk-ink-2);
}
.dlk-hero__media { margin: 0; text-align: center; }
.dlk-hero__media img {
	display: block;
	margin: 0 auto;
	width: min(100%, 560px);
	height: auto;
	filter: drop-shadow(0 40px 50px rgba(0, 0, 0, .55)) drop-shadow(0 0 60px rgba(198, 176, 153, .12));
	animation: dlk-float 9s ease-in-out infinite;
}
@keyframes dlk-float {
	0%, 100% { transform: translateY(0) rotate(-1deg); }
	50% { transform: translateY(-14px) rotate(1deg); }
}

/* Przyciski – jak na stronie głównej: sam tekst w kolorze beżu + strzałka ↗, bez ramki i tła */
.dlk-hero .wp-block-buttons,
.dlk-cta .wp-block-buttons { gap: 4px 40px; }
.dlk-hero .wp-block-button__link,
.dlk-cta .wp-block-button__link,
.dlk-btn {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	min-height: 56px;
	padding: 16px 0 !important;
	background: transparent !important;
	color: var(--dlk-gold) !important;
	border: 0 !important;
	border-radius: 0;
	box-shadow: none !important;
	font-size: 1.125rem;
	font-weight: 400;
	letter-spacing: normal;
	text-transform: uppercase;
	text-decoration: none;
	transition: color .3s ease-in-out;
	-webkit-tap-highlight-color: transparent;
	touch-action: manipulation;
}
.dlk-hero .wp-block-button__link::after,
.dlk-cta .wp-block-button__link::after {
	content: '';
	flex: none;
	width: 1.6em;
	height: 1.6em;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square'%3E%3Cpath d='M7 17 17 7M8 7h9v9'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='square'%3E%3Cpath d='M7 17 17 7M8 7h9v9'/%3E%3C/svg%3E") center / contain no-repeat;
}
.dlk-hero .wp-block-button__link:hover,
.dlk-cta .wp-block-button__link:hover,
.dlk-btn:hover { color: var(--dlk-ink) !important; }
.dlk-btn svg { width: 1.6em; height: 1.6em; flex: none; }

/* ============================================================ NAGŁÓWEK SEKCJI */
.dlk-head {
	background: var(--dlk-bg);
	padding: clamp(40px, 6vw, 84px) var(--dlk-pad) clamp(10px, 2vw, 26px);
	text-align: left;
}
.dlk-head { box-sizing: border-box; }
.dlk-head > * { max-width: var(--dlk-w) !important; margin-left: auto !important; margin-right: auto !important; }
.dlk-head .dlk-kicker {
	margin-top: 0; margin-bottom: 12px;
	font-size: .8rem; letter-spacing: .24em; text-transform: uppercase; color: var(--dlk-gold-2);
}
.dlk-head h2 {
	margin-top: 0; margin-bottom: 10px;
	color: var(--dlk-gold);
	font-size: clamp(1.7rem, 1.2rem + 2vw, 3rem);
	line-height: 1.1;
	font-weight: 700;
}
.dlk-head p:last-child { margin-bottom: 0; color: var(--dlk-mute); font-size: 1rem; }

/* ============================================================ KATALOG */
.dlk {
	background: var(--dlk-bg);
	color: var(--dlk-ink-2);
	-webkit-text-size-adjust: 100%;
}
.dlk *, .dlk *::before, .dlk *::after { box-sizing: border-box; }
.dlk button { font: inherit; color: inherit; cursor: pointer; -webkit-tap-highlight-color: transparent; touch-action: manipulation; }
.dlk :focus-visible { outline: 2px solid var(--dlk-gold); outline-offset: 3px; }

/* pasek filtrów */
.dlk-bar {
	position: sticky;
	top: 0;
	z-index: 30;
	background: rgba(24, 32, 51, .86);
	-webkit-backdrop-filter: blur(16px) saturate(1.2);
	backdrop-filter: blur(16px) saturate(1.2);
	border-top: 1px solid var(--dlk-line);
	border-bottom: 1px solid var(--dlk-line);
}
body.admin-bar .dlk-bar { top: 32px; }
@media (max-width: 782px) { body.admin-bar .dlk-bar { top: 46px; } }
.dlk-bar-inner { max-width: var(--dlk-wp); margin: 0 auto; padding: 12px var(--dlk-pad); }
/* filtry: tekst jak przyciski na stronie głównej; aktywny = beż + cienka linia, zawsze w jednym rzędzie */
.dlk-chips {
	display: flex;
	flex-wrap: nowrap;
	gap: 0;
	overflow-x: auto;
	scroll-snap-type: x proximity;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
	padding: 0;
}
.dlk-chips::-webkit-scrollbar { display: none; }
.dlk-chip {
	position: relative;
	flex: none;
	scroll-snap-align: center;
	display: inline-flex;
	align-items: center;
	gap: 7px;
	min-height: 56px;
	padding: 0 clamp(9px, .95vw, 15px);
	background: transparent;
	border: 0;
	border-radius: 0;
	color: var(--dlk-mute);
	font-size: .84rem;
	letter-spacing: .07em;
	text-transform: uppercase;
	white-space: nowrap;
	transition: color .3s ease-in-out;
}
.dlk-chip:first-child { padding-left: 0; }
.dlk-chip::after { /* cienka linia pod aktywnym */
	content: '';
	position: absolute;
	left: clamp(9px, .95vw, 15px);
	right: clamp(9px, .95vw, 15px);
	bottom: 9px;
	height: 1px;
	background: var(--dlk-gold);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform .5s var(--dlk-ease);
}
.dlk-chip:first-child::after { left: 0; }
.dlk-chip-n {
	font-size: .66rem;
	letter-spacing: 0;
	color: var(--dlk-gold-2);
	transform: translateY(-.45em);
	transition: color .3s ease-in-out;
}
.dlk-chip:hover { color: var(--dlk-ink); }
.dlk-chip.is-active { color: var(--dlk-gold); }
.dlk-chip.is-active::after { transform: scaleX(1); }
.dlk-chip.is-active .dlk-chip-n { color: var(--dlk-gold); }

/* siatka */
.dlk-wrap { max-width: var(--dlk-wp); margin: 0 auto; padding: clamp(22px, 3vw, 44px) var(--dlk-pad) clamp(56px, 8vw, 110px); }
.dlk-grid {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr));
	gap: clamp(14px, 2vw, 28px);
}
@media (min-width: 1060px) { .dlk-grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 640px) and (max-width: 1059px) { .dlk-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 639px) { .dlk-grid { grid-template-columns: 1fr; } }

.dlk-item { margin: 0; padding: 0; }
.dlk-item[hidden] { display: none; }
.dlk-js .dlk-item { opacity: 0; transform: translateY(22px); }
.dlk-js .dlk-item.is-in {
	opacity: 1;
	transform: none;
	transition: opacity .7s var(--dlk-ease) var(--dlk-d, 0ms), transform .7s var(--dlk-ease) var(--dlk-d, 0ms);
}

.dlk-card {
	position: relative;
	display: flex;
	flex-direction: column;
	width: 100%;
	height: 100%;
	padding: 0;
	text-align: left;
	background: linear-gradient(165deg, var(--dlk-panel-1), var(--dlk-panel-2));
	border: 1px solid var(--dlk-line);
	border-radius: 4px;
	overflow: hidden;
}
/* Scena za modelem: marmurowe tło strony głównej (tlo.jpg), poruszane bardzo powoli */
.dlk-card-stage {
	position: relative;
	display: block;
	aspect-ratio: 5 / 4;
	overflow: hidden;
	isolation: isolate;
	background: #131a2b;
	border-bottom: 1px solid var(--dlk-line);
}
.dlk-card-stage::before {
	content: '';
	position: absolute;
	inset: -14%;
	z-index: -2;
	/* złoty poblask z palety + marmur; każdy kafelek pokazuje inny kawałek (zmienne --bgx/--bgy/--bgs) */
	background:
		radial-gradient(64% 64% at var(--glx, 50%) var(--gly, 55%), rgba(198, 176, 153, .26), rgba(198, 176, 153, 0) 74%),
		var(--dlk-tlo) var(--bgx, 62%) var(--bgy, 42%) / var(--bgs, 240%) auto no-repeat;
	opacity: .5;
	transform: translate3d(var(--x0, 0), var(--y0, 0), 0) rotate(var(--r0, 0deg)) scale(var(--s0, 1.05));
	animation: var(--anim, dlk-pan) var(--dur, 22s) ease-in-out infinite alternate;
	animation-play-state: paused; /* ruch startuje przy najechaniu i zatrzymuje się w miejscu po zjechaniu */
	transition: opacity 1.1s ease;
	will-change: transform;
}
@keyframes dlk-pan {
	from { transform: translate3d(var(--x0), var(--y0), 0) rotate(var(--r0)) scale(var(--s0)); }
	to   { transform: translate3d(var(--x1), var(--y1), 0) rotate(var(--r1)) scale(var(--s1)); }
}
@keyframes dlk-turn {
	from { transform: rotate(var(--r0)) scale(var(--s0)) translate3d(var(--x0), var(--y0), 0); }
	to   { transform: rotate(var(--r1)) scale(var(--s1)) translate3d(var(--x1), var(--y1), 0); }
}
@keyframes dlk-zoom {
	0%   { transform: scale(var(--s0)) translate3d(var(--x0), var(--y0), 0); }
	50%  { transform: scale(var(--s1)) translate3d(var(--x1), var(--y1), 0) rotate(var(--r1)); }
	100% { transform: scale(calc(var(--s0) + .08)) translate3d(var(--y1), var(--x0), 0) rotate(var(--r0)); }
}
/* 9 wariantów: inny wycinek tła, inny kierunek i rodzaj ruchu */
.dlk-item:nth-child(9n+1) { --anim: dlk-pan;  --dur: 20s; --bgx: 8%;  --bgy: 12%; --bgs: 260%; --glx: 30%; --gly: 60%; --x0: -4%; --y0: -3%; --s0: 1.05; --r0: 0deg;  --x1: 5%;  --y1: 4%;  --s1: 1.25; --r1: 0deg; }
.dlk-item:nth-child(9n+2) { --anim: dlk-turn; --dur: 26s; --bgx: 92%; --bgy: 30%; --bgs: 300%; --glx: 70%; --gly: 40%; --x0: 3%;  --y0: -2%; --s0: 1.2;  --r0: -5deg; --x1: -3%; --y1: 3%;  --s1: 1.4;  --r1: 5deg; }
.dlk-item:nth-child(9n+3) { --anim: dlk-zoom; --dur: 18s; --bgx: 50%; --bgy: 96%; --bgs: 230%; --glx: 50%; --gly: 70%; --x0: 0%;  --y0: 4%;  --s0: 1.05; --r0: 0deg;  --x1: -3%; --y1: -4%; --s1: 1.34; --r1: 2deg; }
.dlk-item:nth-child(9n+4) { --anim: dlk-turn; --dur: 24s; --bgx: 22%; --bgy: 64%; --bgs: 280%; --glx: 25%; --gly: 45%; --x0: -3%; --y0: 3%;  --s0: 1.15; --r0: 4deg;  --x1: 4%;  --y1: -3%; --s1: 1.35; --r1: -4deg; }
.dlk-item:nth-child(9n+5) { --anim: dlk-pan;  --dur: 17s; --bgx: 78%; --bgy: 88%; --bgs: 250%; --glx: 75%; --gly: 65%; --x0: 5%;  --y0: 4%;  --s0: 1.08; --r0: 0deg;  --x1: -5%; --y1: -2%; --s1: 1.3;  --r1: 3deg; }
.dlk-item:nth-child(9n+6) { --anim: dlk-zoom; --dur: 22s; --bgx: 4%;  --bgy: 96%; --bgs: 310%; --glx: 45%; --gly: 40%; --x0: -4%; --y0: 0%;  --s0: 1.1;  --r0: -3deg; --x1: 4%;  --y1: -3%; --s1: 1.38; --r1: 4deg; }
.dlk-item:nth-child(9n+7) { --anim: dlk-pan;  --dur: 25s; --bgx: 98%; --bgy: 4%;  --bgs: 270%; --glx: 60%; --gly: 55%; --x0: 4%;  --y0: -4%; --s0: 1.12; --r0: 2deg;  --x1: -4%; --y1: 3%;  --s1: 1.28; --r1: -2deg; }
.dlk-item:nth-child(9n+8) { --anim: dlk-turn; --dur: 19s; --bgx: 44%; --bgy: 28%; --bgs: 240%; --glx: 35%; --gly: 70%; --x0: 0%;  --y0: -3%; --s0: 1.1;  --r0: 6deg;  --x1: 3%;  --y1: 4%;  --s1: 1.36; --r1: -6deg; }
.dlk-item:nth-child(9n+9) { --anim: dlk-zoom; --dur: 23s; --bgx: 66%; --bgy: 72%; --bgs: 290%; --glx: 55%; --gly: 35%; --x0: 3%;  --y0: 3%;  --s0: 1.06; --r0: 0deg;  --x1: -4%; --y1: -3%; --s1: 1.32; --r1: 3deg; }
.dlk-card-stage::after { /* winieta: model zawsze czytelny na ciemnym środku */
	content: '';
	position: absolute;
	inset: 0;
	z-index: -1;
	background:
		radial-gradient(62% 66% at 50% 50%, rgba(14, 20, 34, .62), rgba(14, 20, 34, .1) 78%),
		linear-gradient(180deg, rgba(14, 20, 34, .25), rgba(14, 20, 34, 0) 35%);
	transition: opacity 1.1s ease;
}
.dlk-card-img {
	/* Złota proporcja: pole zdjęcia = 1/φ (61,8%) kafelka w obu osiach; marginesy boczne 19,1%, góra 17% / dół 21,2% (środek optyczny nieco wyżej niż geometryczny) */
	position: absolute;
	top: 17%;
	left: 19.1%;
	width: 61.8%;
	height: 61.8%;
	object-fit: contain;
	filter: drop-shadow(0 22px 26px rgba(0, 0, 0, .55));
}
.dlk-card-body { display: block; padding: 20px 24px 26px; padding-right: 84px; }
.dlk-card-cat {
	display: block;
	margin-bottom: 8px;
	font-size: .72rem;
	letter-spacing: .22em;
	text-transform: uppercase;
	color: var(--dlk-gold-2);
	color: #a99985;
}
.dlk-card-title {
	display: block;
	color: var(--dlk-gold);
	font-size: clamp(1.15rem, 1.05rem + .45vw, 1.45rem);
	font-weight: 600;
	line-height: 1.2;
}
.dlk-card-text {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	margin-top: 10px;
	font-size: .92rem;
	line-height: 1.55;
	color: var(--dlk-mute);
}
.dlk-card-go {
	position: absolute;
	right: 20px; bottom: 22px;
	display: grid;
	place-items: center;
	width: 48px; height: 48px;
	border: 1px solid var(--dlk-line-2);
	border-radius: 50%;
	color: var(--dlk-gold);
	font-size: 1.3rem;
	transition: background .6s ease, color .6s ease, border-color .6s ease;
}
/* przy najechaniu: marmur ze złotym poblaskiem rozjaśnia się i płynie, produkt się powiększa, karta lekko unosi, akcenty w kolorze palety */
.dlk-card { transition: transform .7s var(--dlk-ease), border-color .7s ease, box-shadow .7s ease; }
.dlk-card-img { transition: transform 1.1s var(--dlk-ease); }
.dlk-card-cat, .dlk-card-title { transition: color .6s ease; }
@media (hover: hover) {
	.dlk-card:hover { transform: translateY(-5px); border-color: rgba(198, 176, 153, .55); box-shadow: 0 30px 46px -30px rgba(0, 0, 0, .85), 0 0 0 1px rgba(198, 176, 153, .12); }
	.dlk-card:hover .dlk-card-stage::before { opacity: .88; animation-play-state: running; }
	.dlk-card:hover .dlk-card-stage::after { opacity: .8; }
	.dlk-card:hover .dlk-card-img { transform: scale(1.07) translateY(-1.5%); }
	.dlk-card:hover .dlk-card-cat { color: var(--dlk-gold); }
	.dlk-card:hover .dlk-card-title { color: #ddcdb9; }
}
.dlk-card:focus-visible .dlk-card-stage::before { opacity: 1; animation-play-state: running; }
.dlk-card:active .dlk-card-stage::before { opacity: 1; animation-play-state: running; }
.dlk-card:active { transform: scale(.992); }

/* ============================================================ WIDOK SZCZEGÓŁÓW */
html.dlk-lock { overflow: hidden; }
.dlk-modal {
	position: fixed;
	inset: 0;
	width: 100vw; max-width: none;
	height: 100vh; height: 100dvh; max-height: none;
	margin: 0; padding: 0;
	border: 0;
	background: var(--dlk-bg-deep);
	color: var(--dlk-ink-2);
	overflow: hidden;
}
.dlk-modal:not([open]) { display: none; }
.dlk-modal::backdrop { background: #0b101c; }
.dlk-modal[open] { animation: dlk-modal-in .45s var(--dlk-ease); }
@keyframes dlk-modal-in { from { opacity: 0; transform: scale(.985); } to { opacity: 1; transform: none; } }

.dlk-modal-inner {
	display: grid;
	grid-template-rows: minmax(0, 1fr) auto;
	height: 100%;
	padding-bottom: env(safe-area-inset-bottom);
}
.dlk-modal-body { min-height: 0; }
.dlk-modal-body.dlk-from-r { animation: dlk-from-r .5s var(--dlk-ease); }
.dlk-modal-body.dlk-from-l { animation: dlk-from-l .5s var(--dlk-ease); }
@keyframes dlk-from-r { from { opacity: 0; transform: translateX(40px); } to { opacity: 1; transform: none; } }
@keyframes dlk-from-l { from { opacity: 0; transform: translateX(-40px); } to { opacity: 1; transform: none; } }

.dlk-detail {
	display: grid;
	grid-template-columns: minmax(0, 1.28fr) minmax(0, 1fr);
	height: 100%;
}
@media (max-width: 899px), (orientation: portrait) and (max-width: 1100px) {
	.dlk-detail { grid-template-columns: 1fr; grid-template-rows: minmax(0, 46fr) minmax(0, 54fr); }
}

.dlk-gallery {
	display: flex;
	flex-direction: column;
	min-height: 0;
	position: relative;
	isolation: isolate;
	overflow: hidden;
	background: #0f1524;
	border-right: 1px solid var(--dlk-line);
}
.dlk-gallery::before { /* ten sam marmur, w widoku szczegółów płynie nieustannie, bardzo powoli */
	content: '';
	position: absolute;
	inset: -12%;
	z-index: -2;
	background: var(--dlk-tlo) 60% 45% / cover no-repeat;
	opacity: .85;
	animation: dlk-drift 70s ease-in-out infinite alternate;
	will-change: transform;
}
.dlk-gallery::after {
	content: '';
	position: absolute;
	inset: 0;
	z-index: -1;
	background:
		radial-gradient(58% 62% at 50% 46%, rgba(10, 15, 27, .6), rgba(10, 15, 27, .12) 80%),
		linear-gradient(180deg, rgba(10, 15, 27, .15), rgba(10, 15, 27, .55));
}
@keyframes dlk-drift {
	from { transform: scale(1.04) translate3d(2%, 1.5%, 0); }
	to { transform: scale(1.22) translate3d(-3%, -2.5%, 0) rotate(.6deg); }
}
.dlk-thumbs { position: relative; z-index: 1; }
.dlk-stage { position: relative; flex: 1; min-height: 0; overflow: hidden; }
.dlk-track {
	display: flex;
	height: 100%;
	margin: 0; padding: 0;
	list-style: none;
	overflow-x: auto;
	overflow-y: hidden;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
	overscroll-behavior-x: contain;
}
.dlk-track::-webkit-scrollbar { display: none; }
.dlk-slide {
	flex: 0 0 100%;
	height: 100%;
	margin: 0;
	box-sizing: border-box;
	display: block;
	padding: clamp(18px, 4vh, 48px) clamp(16px, 4vw, 56px);
	scroll-snap-align: center;
	scroll-snap-stop: always;
	overflow: hidden;
}
.dlk-slide-img {
	display: block;
	width: 100%;
	height: 100%;
	min-height: 0;
	object-fit: contain;
	filter: drop-shadow(0 30px 36px rgba(0, 0, 0, .55));
	cursor: zoom-in;
	transition: transform .5s var(--dlk-ease);
	-webkit-user-drag: none;
	user-select: none;
}
.dlk-stage.is-zoom .dlk-track { overflow: hidden; touch-action: none; }
.dlk-stage.is-zoom .dlk-slide-img { transform: scale(2.3); cursor: zoom-out; }
/* rząd pod zdjęciem: miniatury na środku, przycisk powiększania po prawej (przy jednym zdjęciu – na środku) */
.dlk-zoom {
	grid-column: 3;
	justify-self: end;
	display: grid;
	place-items: center;
	width: 52px; height: 52px;
	padding: 0;
	background: transparent;
	border: 1px solid var(--dlk-line-2);
	border-radius: 50%;
	color: var(--dlk-gold);
	font-size: 1.4rem;
	transition: background .25s, color .25s, border-color .25s;
}
.dlk-zoom[aria-pressed='true'] { background: var(--dlk-gold); color: var(--dlk-bg); }
.dlk-thumbs-list:empty + .dlk-zoom { grid-column: 2; justify-self: center; }

.dlk-thumbs {
	display: grid;
	grid-template-columns: minmax(52px, 1fr) minmax(0, auto) minmax(52px, 1fr);
	align-items: center;
	gap: 10px;
	padding: 12px 16px 16px;
}
.dlk-thumbs-list {
	grid-column: 2;
	display: flex;
	justify-content: center;
	gap: 10px;
	min-width: 0;
	overflow-x: auto;
	scrollbar-width: none;
}
.dlk-thumbs-list::-webkit-scrollbar { display: none; }
.dlk-thumb {
	flex: none;
	width: 72px; height: 72px;
	padding: 6px;
	background: rgba(255, 255, 255, .03);
	border: 1px solid var(--dlk-line);
	border-radius: 4px;
	opacity: .65;
	transition: opacity .25s, border-color .25s, background .25s;
}
.dlk-thumb-img { display: block; width: 100%; height: 100%; object-fit: contain; }
.dlk-thumb.is-active { opacity: 1; border-color: var(--dlk-gold); background: rgba(198, 176, 153, .1); }

.dlk-info {
	min-height: 0;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	padding: clamp(28px, 4.4vw, 68px);
	padding-top: clamp(72px, 7vw, 96px);
}
.dlk-info-cat {
	margin: 0 0 14px;
	font-size: .78rem;
	letter-spacing: .24em;
	text-transform: uppercase;
	color: #a99985;
}
.dlk-info-title {
	margin: 0 0 22px;
	color: var(--dlk-gold);
	font-size: clamp(1.7rem, 1.1rem + 2.3vw, 3rem);
	font-weight: 700;
	line-height: 1.08;
	text-transform: none;
}
.dlk-desc { font-size: clamp(1rem, .96rem + .2vw, 1.12rem); line-height: 1.7; }
.dlk-desc p { margin: 0 0 1.1em; color: var(--dlk-ink-2); }
.dlk-desc ul, .dlk-desc ol { list-style: none; margin: 1.6em 0; padding: 0; border-top: 1px solid var(--dlk-line); }
.dlk-desc li {
	display: grid;
	grid-template-columns: minmax(104px, 32%) 1fr;
	gap: 6px 18px;
	margin: 0;
	padding: 15px 0;
	border-bottom: 1px solid var(--dlk-line);
	color: var(--dlk-ink);
	line-height: 1.5;
}
.dlk-desc li strong {
	font-size: .74rem;
	font-weight: 500;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--dlk-gold);
	padding-top: .3em;
}
.dlk-actions { margin: 2em 0 0; }

.dlk-close {
	position: absolute;
	top: max(18px, env(safe-area-inset-top)); right: 18px;
	z-index: 5;
	display: grid;
	place-items: center;
	width: 54px; height: 54px;
	padding: 0;
	background: rgba(17, 24, 39, .72);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
	border: 1px solid var(--dlk-line-2);
	border-radius: 50%;
	color: var(--dlk-gold);
	font-size: 1.5rem;
	transition: background .25s, color .25s, transform .25s;
}
.dlk-close:hover { background: var(--dlk-gold); color: var(--dlk-bg); transform: rotate(90deg); }

/* dolny pasek: poprzedni / numer / następny */
.dlk-pager {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	gap: 12px;
	min-height: 72px;
	padding: 8px clamp(10px, 2vw, 28px);
	background: #0d1220;
	border-top: 1px solid var(--dlk-line);
}
.dlk-pager-btn {
	display: flex;
	align-items: center;
	gap: 14px;
	min-height: 56px;
	padding: 6px 14px;
	background: transparent;
	border: 0;
	border-radius: 4px;
	color: var(--dlk-gold);
	font-size: 1.6rem;
	text-align: left;
	min-width: 0;
	transition: background .2s;
}
.dlk-pager-btn:hover:not(:disabled) { background: rgba(198, 176, 153, .08); }
.dlk-pager-btn:disabled { opacity: .3; cursor: default; }
.dlk-next { justify-self: end; text-align: right; flex-direction: row; }
.dlk-pager-txt { display: grid; min-width: 0; font-size: 1rem; line-height: 1.25; }
.dlk-pager-txt small { font-size: .68rem; letter-spacing: .2em; text-transform: uppercase; color: var(--dlk-mute); }
.dlk-pager-txt b { font-weight: 500; font-size: .98rem; color: var(--dlk-ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dlk-count { font-size: .85rem; letter-spacing: .18em; color: var(--dlk-gold); font-variant-numeric: tabular-nums; }
@media (max-width: 640px) {
	.dlk-pager-txt b { display: none; }
	.dlk-pager-txt small { font-size: .74rem; }
}

/* ============================================================ CTA */
.dlk-cta {
	position: relative;
	padding: clamp(56px, 9vw, 120px) var(--dlk-pad);
	text-align: center;
	color: var(--dlk-ink-2);
	background:
		radial-gradient(60% 120% at 50% 0%, rgba(198, 176, 153, .12), transparent 70%),
		var(--dlk-bg-deep);
	border-top: 1px solid var(--dlk-line);
}
.dlk-cta { box-sizing: border-box; }
.dlk-cta > * { max-width: 760px !important; margin-left: auto !important; margin-right: auto !important; }
.dlk-cta .dlk-kicker { margin-top: 0; font-size: .8rem; letter-spacing: .24em; text-transform: uppercase; color: var(--dlk-gold-2); }
.dlk-cta h2 { color: var(--dlk-gold); font-size: clamp(1.8rem, 1.2rem + 2.4vw, 3.2rem); line-height: 1.1; font-weight: 700; margin-top: 0; }
.dlk-cta .wp-block-buttons { justify-content: center; margin-top: 30px; }
.dlk-cta .dlk-contact { margin-top: 28px; color: var(--dlk-mute); font-size: 1rem; }
.dlk-cta .dlk-contact a { color: var(--dlk-ink); text-decoration: none; border-bottom: 1px solid var(--dlk-line-2); }
.dlk-cta .dlk-contact a:hover { color: var(--dlk-gold); }

/* Motyw (Kadence) nadaje przyciskom własny kolor tła/tekstu przy :hover/:focus – tu go neutralizujemy */
.dlk button { box-shadow: none; text-shadow: none; }
.dlk .dlk-card,
.dlk .dlk-card:hover,
.dlk .dlk-card:focus,
.dlk .dlk-card:active {
	background: linear-gradient(165deg, var(--dlk-panel-1), var(--dlk-panel-2));
	color: var(--dlk-ink-2);
}
.dlk .dlk-card-go { background: transparent; color: var(--dlk-gold); }
.dlk .dlk-card:hover .dlk-card-go { background: var(--dlk-gold); color: var(--dlk-bg); border-color: var(--dlk-gold); }
.dlk .dlk-chip,
.dlk .dlk-chip:hover,
.dlk .dlk-chip:focus { background: transparent; }
.dlk .dlk-chip { color: var(--dlk-mute); }
.dlk .dlk-chip:hover { color: var(--dlk-ink); }
.dlk .dlk-chip.is-active,
.dlk .dlk-chip.is-active:hover,
.dlk .dlk-chip.is-active:focus { color: var(--dlk-gold); }
.dlk .dlk-thumb:hover,
.dlk .dlk-thumb:focus { background: rgba(255, 255, 255, .03); }
.dlk .dlk-thumb.is-active,
.dlk .dlk-thumb.is-active:hover { background: rgba(198, 176, 153, .1); }
.dlk .dlk-zoom:hover,
.dlk .dlk-zoom:focus { background: rgba(17, 24, 39, .6); color: var(--dlk-gold); }
.dlk .dlk-zoom[aria-pressed='true'],
.dlk .dlk-zoom[aria-pressed='true']:hover { background: var(--dlk-gold); color: var(--dlk-bg); }
.dlk .dlk-pager-btn,
.dlk .dlk-pager-btn:focus { background: transparent; color: var(--dlk-gold); }
.dlk .dlk-pager-btn:hover:not(:disabled) { background: rgba(198, 176, 153, .08); color: var(--dlk-gold); }
.dlk .dlk-close,
.dlk .dlk-close:focus { background: rgba(17, 24, 39, .72); color: var(--dlk-gold); }
.dlk .dlk-close:hover { background: var(--dlk-gold); color: var(--dlk-bg); }

/* edytor */
.dlk-editor-preview .dlk-item { opacity: 1; transform: none; }
.dlk-editor-preview .dlk-modal { display: none; }

@media (prefers-reduced-motion: reduce) {
	.dlk-gallery::before, .dlk-card-stage::before { animation: none !important; transition: none !important; }
	.dlk-hero__media img { animation: none; }
	.dlk *, .dlk-modal, .dlk-modal-body { animation: none !important; transition: none !important; }
	.dlk-js .dlk-item { opacity: 1; transform: none; }
}

/* ============================================================ TELEFON / TABLET – poprawki układu */
/* motyw dodaje listom lewy odstęp; w katalogu listy mają być bez odstępów */
.dlk ul.dlk-grid,
.dlk ul.dlk-track,
.dlk ul.dlk-slide-list { padding: 0 !important; margin: 0 !important; list-style: none; }
.dlk .dlk-grid > li,
.dlk .dlk-track > li { margin: 0; }

/* sekcje pełnej szerokości: boczny odstęp zawsze, także gdy motyw zeruje padding grup */
.dlk-head,
.dlk-cta { box-sizing: border-box; padding-left: var(--dlk-pad) !important; padding-right: var(--dlk-pad) !important; }
.dlk-head > *, .dlk-cta > * { box-sizing: border-box; }

@media (max-width: 781px) {
	/* hero mieści się na jednym ekranie telefonu */
	.dlk-hero.wp-block-cover { min-height: 100svh !important; align-items: flex-start; }
	.dlk-hero { padding-top: 108px !important; padding-bottom: 28px !important; }
	.dlk-hero .dlk-hero__cols { gap: 14px; }
	.dlk-hero .dlk-kicker { margin-bottom: 10px; font-size: .72rem; }
	.dlk-hero h1 { font-size: clamp(2.2rem, 11vw, 3rem); margin-bottom: 14px; }
	.dlk-hero .dlk-lead { font-size: .98rem; line-height: 1.55; margin-bottom: 8px; }
	.dlk-hero .wp-block-buttons { gap: 0 28px; }
	.dlk-hero .wp-block-button__link { font-size: 1rem; min-height: 48px; padding: 10px 0 !important; }
	.dlk-hero__media img { width: auto; max-width: 78%; max-height: 27svh; animation: none; }
	.dlk-head { padding-top: 40px; }
	.dlk-card-body { padding-right: 76px; }
	.dlk-cta .wp-block-buttons { margin-top: 18px; }
}

@media (max-width: 781px) {
	.dlk-hero h1 { margin-top: 0 !important; }
	.dlk-hero .dlk-kicker { margin-top: 0 !important; }
	.dlk-hero .wp-block-buttons { gap: 0 24px; flex-wrap: wrap; }
	.dlk-hero .wp-block-button__link { font-size: .94rem; gap: 6px; }
	.dlk-hero .wp-block-button__link::after { width: 1.45em; height: 1.45em; }
	.dlk-hero__media img { max-height: 31svh; }
}

@media (max-width: 560px) {
	/* kontakt: e-mail i telefon w osobnych liniach, bez łamania numeru */
	.dlk-cta .dlk-contact { font-size: 0; line-height: 1; }
	.dlk-cta .dlk-contact a { display: block; width: fit-content; margin: 0 auto 14px; font-size: 1rem; line-height: 1.3; white-space: nowrap; }
	.dlk-cta .dlk-contact a:last-child { margin-bottom: 0; }
}

@media (max-width: 640px) {
	/* pasek poprzedni / następny: na telefonie same strzałki + numer (opis zostaje dla czytników ekranu) */
	.dlk-pager-txt { position: absolute !important; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
	.dlk-pager-btn { min-width: 64px; min-height: 56px; justify-content: center; font-size: 1.7rem; }
	.dlk-prev { justify-self: start; }
	.dlk-next { justify-self: end; }
	/* tabela cech: etykieta nad wartością, bez łamania słów */
	.dlk-desc li { grid-template-columns: 1fr; gap: 4px; padding: 13px 0; }
	.dlk-desc li strong { padding-top: 0; letter-spacing: .14em; overflow-wrap: normal; word-break: normal; }
}

/* lista cech: bez wcięcia z motywu (etykiety równo z tytułem) */
.dlk .dlk-desc ul,
.dlk .dlk-desc ol { padding-left: 0 !important; margin-left: 0 !important; }
.dlk .dlk-desc li { padding-left: 0 !important; margin-left: 0 !important; list-style: none !important; }
.dlk .dlk-desc li::marker { content: ''; }

/* niskie ekrany telefonów (np. iPhone SE) */
@media (max-width: 781px) and (max-height: 700px) {
	.dlk-hero.wp-block-cover { min-height: 0 !important; }
	.dlk-hero { padding-top: 92px !important; padding-bottom: 22px !important; }
	.dlk-hero h1 { font-size: clamp(2rem, 10vw, 2.6rem); }
	.dlk-hero .dlk-lead { font-size: .92rem; }
	.dlk-hero__media img { max-height: 22svh; }
}

@media (max-width: 640px) {
	.dlk-thumbs { padding: 10px 14px 14px; gap: 8px; }
	.dlk-thumbs-list { gap: 8px; }
	.dlk-thumb { width: 60px; height: 60px; padding: 5px; }
	.dlk-zoom { width: 48px; height: 48px; }
}

/* ============================================================ TRYB SZCZEGÓŁÓW (zdjęcie na całe okno, opis ukryty) */
.dlk-detail { transition: grid-template-columns .65s var(--dlk-ease), grid-template-rows .65s var(--dlk-ease); }
.dlk-info { min-width: 0; transition: opacity .35s ease; }

.dlk-focus {
	grid-column: 1;
	justify-self: start;
	display: grid;
	place-items: center;
	width: 52px; height: 52px;
	padding: 0;
	background: transparent;
	border: 1px solid var(--dlk-line-2);
	border-radius: 50%;
	color: var(--dlk-gold);
	font-size: 1.4rem;
	transition: background .25s, color .25s, border-color .25s;
}
.dlk-focus .dlk-ico-shrink { display: none; }
.dlk-focus[aria-pressed='true'] .dlk-ico-expand { display: none; }
.dlk-focus[aria-pressed='true'] .dlk-ico-shrink { display: grid; }
.dlk-focus span { display: grid; place-items: center; }
.dlk .dlk-focus,
.dlk .dlk-focus:focus { background: transparent; color: var(--dlk-gold); }
.dlk .dlk-focus:hover { border-color: var(--dlk-gold); color: #ddcdb9; }
.dlk .dlk-focus[aria-pressed='true'],
.dlk .dlk-focus[aria-pressed='true']:hover { background: var(--dlk-gold); color: var(--dlk-bg); }

.dlk-focus-title {
	position: absolute;
	left: 24px;
	top: max(22px, env(safe-area-inset-top));
	z-index: 3;
	max-width: calc(100% - 120px);
	pointer-events: none;
	opacity: 0;
	transform: translateY(-6px);
	transition: opacity .5s ease .25s, transform .5s ease .25s;
}
.dlk-focus-title span { display: block; margin-bottom: 4px; font-size: .7rem; letter-spacing: .22em; text-transform: uppercase; color: #a99985; }
.dlk-focus-title b { display: block; color: var(--dlk-gold); font-size: 1.2rem; font-weight: 600; line-height: 1.2; }
.dlk-detail.is-focus .dlk-focus-title { opacity: 1; transform: none; }

.dlk-detail.is-focus { grid-template-columns: minmax(0, 1fr) minmax(0, 0fr); }
.dlk-detail.is-focus .dlk-info { padding: 0 !important; opacity: 0; visibility: hidden; overflow: hidden; }
.dlk-detail.is-focus .dlk-gallery { border-right: 0; }
.dlk-detail.is-focus .dlk-slide { padding: clamp(64px, 10vh, 92px) clamp(8px, 2vw, 28px) clamp(6px, 1.5vh, 18px); }
.dlk-detail.is-focus .dlk-stage.is-zoom .dlk-slide-img { transform: scale(3.1); }

@media (max-width: 899px), (orientation: portrait) and (max-width: 1100px) {
	.dlk-detail.is-focus { grid-template-columns: 1fr; grid-template-rows: minmax(0, 100fr) minmax(0, 0fr); }
}
@media (max-width: 640px) {
	.dlk-focus { width: 48px; height: 48px; }
	.dlk-focus-title { left: 18px; max-width: calc(100% - 100px); }
	.dlk-focus-title b { font-size: 1.05rem; }
}
@media (prefers-reduced-motion: reduce) {
	.dlk-detail, .dlk-info, .dlk-focus-title { transition: none !important; }
}
.dlk-focus-title span, .dlk-focus-title b { text-shadow: 0 1px 14px rgba(8, 12, 22, .85), 0 0 3px rgba(8, 12, 22, .6); }

/* ============================================================ OKNO PRODUKTU – margines wokół zdjęcia (desktop / tablet poziomo) */
@media (min-width: 1101px), (min-width: 900px) and (orientation: landscape) {
	.dlk-slide { padding: clamp(40px, 9vh, 112px) clamp(40px, 7vw, 128px); }
	.dlk-detail.is-focus .dlk-slide { padding: clamp(64px, 10vh, 92px) clamp(28px, 5vw, 96px) clamp(16px, 4vh, 48px); }
}

/* Okno produktu (desktop / tablet poziomo): zdjęcie w złotej proporcji – pole = 1/φ (61,8%) obszaru galerii, marginesy boki 19,1%, góra 17%, dół 21,2%.
   Jednostki kontenera (cqw/cqh) liczą od obszaru zdjęcia (.dlk-stage); starsze przeglądarki dostają margines z reguły wyżej. */
@supports (width: 1cqw) {
	@media (min-width: 1101px), (min-width: 900px) and (orientation: landscape) {
		.dlk-stage { container-type: size; }
		.dlk-slide { padding: 17cqh 19.1cqw 21.2cqh; }
	}
}