/* ==========================================================================
   Gifciak — pomocnik marki, inspiracje (aranżacje 2027), ilustracja wnętrza
   i tabela danych technicznych w opisie produktu.
   Spokojnie jak reszta motywu: jasne tło, granat, złoto tylko jako akcent.
   ========================================================================== */

/* ---------- Pomocnik ---------- */

.gfk {
	display: flex;
	align-items: center;
	gap: 1rem;
	margin: 1.25rem 0;
	padding: .875rem 1.125rem .875rem .875rem;
	background: var(--mist);
	border: 1px solid var(--mist-2);
	border-radius: var(--radius);
	color: var(--text);
}

.gfk__fig {
	flex: none;
	display: block;
	line-height: 0;
}

.gfk__img {
	display: block;
	width: 100%;
	height: auto;
	pointer-events: none;
	user-select: none;
	transform-origin: 50% 100%;
}

.gfk__body {
	flex: 1; min-width: 0;
	/* Na szerokim bloku tekst po lewej, przycisk/link po prawej; na wąskim — jedno pod drugim */
	display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1.5rem;
}
.gfk__text { flex: 1 1 18rem; margin: 0; font-weight: 600; color: var(--ink); line-height: 1.45; }
.gfk__actions { display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; margin: 0; }
.gfk__more, .gfk__contacts, .gfk__body > .gfk__toggle + .gfk__more { flex-basis: 100%; }
.gfk__toggle { flex: none; }

.gfk__link {
	display: inline-flex;
	align-items: center;
	gap: .375rem;
	padding: 0;
	border: 0;
	background: none;
	color: var(--ink);
	font: inherit;
	font-weight: 700;
	text-decoration: underline;
	text-underline-offset: .2em;
	cursor: pointer;
}
.gfk__link .icon { width: 1.05rem; height: 1.05rem; }
.gfk__link:hover { color: var(--gold-text); }

.gfk__toggle {
	display: inline-flex;
	align-items: center;
	gap: .25rem;
	min-height: 2.75rem;
	padding: .25rem .75rem .25rem .875rem;
	border: 1.5px solid var(--line);
	border-radius: 999px;
	background: #fff;
	color: var(--ink);
	font: inherit;
	font-weight: 700;
	font-size: var(--step--1);
	cursor: pointer;
}
.gfk__toggle:hover { border-color: var(--ink); }
.gfk__toggle .icon { width: 1.15rem; height: 1.15rem; transition: transform .2s ease; }
.gfk__toggle[aria-expanded="true"] .icon { transform: rotate(180deg); }

.gfk__more { font-size: var(--step--1); color: var(--text); }
.gfk__more ul { margin: .25rem 0 0; padding-left: 1.1rem; }
.gfk__more li + li { margin-top: .25rem; }

.gfk__contacts { display: flex; flex-wrap: wrap; gap: .25rem 1rem; margin: 0; padding: 0; list-style: none; font-size: var(--step--1); }
.gfk__contacts a { font-weight: 700; color: var(--ink); }

/* Warianty: prezentacja 100–220 px, pomoc 64–96 px, kompakt ok. 40 px */
.gfk--prezentacja { background: #fff; border-color: var(--line); gap: 1.25rem; }
.gfk--prezentacja .gfk__fig { width: clamp(6.25rem, 14vw, 12.5rem); }
.gfk--prezentacja .gfk__text { font-size: var(--step-1); }
.gfk--pomoc .gfk__fig { width: clamp(4rem, 8vw, 5.5rem); }
.gfk--kompakt { padding: .5rem .875rem .5rem .5rem; gap: .75rem; font-size: var(--step--1); }
.gfk--kompakt .gfk__fig { width: 2.5rem; }
.gfk--kompakt .gfk__text { font-weight: 600; }

/* Na ciemnym tle (sekcje granatowe) — jasna karta, żeby postać i tekst były czytelne */
.gfk--na-ciemnym { background: #fff; border-color: transparent; }

/* Wyśrodkowane (pusty koszyk, 404) */
.gfk--srodek { margin-inline: auto; }

/* Na telefonie najwyżej jeden blok pomocniczy na etapie: drugorzędne chowamy */
@media (max-width: 760px) {
	.gfk { gap: .75rem; padding: .75rem .875rem .75rem .625rem; }
	.gfk--drugi { display: none; }
	.gfk--prezentacja .gfk__fig { width: clamp(5.5rem, 26vw, 7.5rem); }
}

/* ---------- Ruch (tylko przesunięcia i obroty całej postaci, bez deformacji) ---------- */

/* Druga warstwa obrazka do płynnego przenikania między pozami (dodaje ją main.js). */
.gfk__fig { position: relative; transform-origin: 50% 100%; }
.gfk__img--next { position: absolute; inset: 0; opacity: 0; transition: opacity .2s ease-in-out; }
.gfk__fig.is-fade .gfk__img--next { opacity: 1; }

@media (prefers-reduced-motion: no-preference) {
	/* Powitanie: do startu sekwencji (main.js) postać czeka niewidoczna; bez JS pokaże się sama po chwili. */
	.gfk[data-gfk-anim="powitanie"] .gfk__fig:not(.is-start) { opacity: 0; animation: gfk-pokaz .3s ease-out 2s forwards; }
	.gfk__fig.gfk-a-wejscie { animation: gfk-wejscie 1.1s cubic-bezier(.25, .7, .3, 1) both, gfk-krok .275s ease-in-out 4; }
	.gfk__fig.gfk-a-kolys { animation: gfk-kolys 1.4s ease-in-out 2; }
	.gfk__fig.gfk-a-reakcja { animation: gfk-reakcja .55s ease-out 1; }
	.gfk__fig.gfk-a-podskok { animation: gfk-podskok .8s cubic-bezier(.3, .7, .4, 1) 1; }
}

@keyframes gfk-pokaz { to { opacity: 1; } }
@keyframes gfk-wejscie {
	from { opacity: 0; translate: -1.25rem 0; }
	25% { opacity: 1; }
	to { opacity: 1; translate: 0 0; }
}
/* Krok: lekkie uniesienie przy każdym kroku (całe ciało, bez rozciągania) */
@keyframes gfk-krok {
	0%, 100% { transform: translateY(0); }
	50% { transform: translateY(-.18rem); }
}
@keyframes gfk-kolys {
	0%, 100% { rotate: 0deg; }
	25% { rotate: -3deg; }
	75% { rotate: 3deg; }
}
@keyframes gfk-reakcja {
	0%, 100% { transform: none; }
	35% { transform: translateY(-.35rem); }
	65% { transform: translateY(.05rem); }
}
@keyframes gfk-podskok {
	0%, 100% { transform: translateY(0); }
	35% { transform: translateY(-.7rem); }
	60% { transform: translateY(0); }
	78% { transform: translateY(-.2rem); }
}

/* ---------- Inspiracje: aranżacje okładek 2027 ---------- */

.inspiracje { padding-block: var(--section-y); }
.inspiracje--jasne { background: var(--mist); }
.inspiracje__intro { max-width: 40rem; color: var(--muted); margin-top: 0; }
.inspiracje__grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 13.5rem), 1fr));
	gap: 1.5rem;
	margin: 1.75rem 0 0;
	padding: 0;
	list-style: none;
}
.inspiracja { margin: 0; }
.inspiracja__open {
	position: relative;
	display: block;
	border-radius: var(--radius);
	overflow: hidden;
	background: var(--mist-2);
	aspect-ratio: 3 / 4;
}
.inspiracja__open img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s ease; }
.inspiracja__open:hover img { transform: scale(1.03); }
@media (prefers-reduced-motion: reduce) { .inspiracja__open img { transition: none; } .inspiracja__open:hover img { transform: none; } }
.inspiracja__badge {
	position: absolute;
	left: .625rem;
	top: .625rem;
	padding: .2rem .55rem;
	border-radius: 999px;
	background: rgba(255, 255, 255, .94);
	color: var(--ink);
	font-size: .8125rem;
	font-weight: 700;
	line-height: 1.4;
}
.inspiracja figcaption { margin-top: .75rem; font-size: var(--step--1); line-height: 1.5; }
.inspiracja figcaption strong { display: block; color: var(--ink); font-size: var(--step-0); margin-bottom: .15rem; }
.inspiracja__note { display: block; margin-top: .35rem; color: var(--muted); font-size: .8125rem; }

/* Strona główna: karuzela aranżacji. Zdjęcia bez przycinania i równej wysokości (--h); szerokość
   slajdu z proporcji zdjęcia (--ar). Pasek przewija się palcem, kółkiem z Shift albo strzałkami;
   strzałka i wygaszona krawędź tylko po stronie, w którą da się przewinąć (main.js: .can-prev / .can-next). */
.karuzela { --h: clamp(17rem, 26vw, 23rem); position: relative; margin-top: 1.75rem; }
.inspiracje--karuzela .inspiracje__grid {
	display: flex; gap: clamp(.75rem, 2vw, 1.5rem); margin: 0; padding-bottom: .25rem;
	overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x proximity; scrollbar-width: none;
	--fade-l: #000; --fade-r: #000;
	-webkit-mask-image: linear-gradient(to right, var(--fade-l), #000 3rem, #000 calc(100% - 3rem), var(--fade-r));
	mask-image: linear-gradient(to right, var(--fade-l), #000 3rem, #000 calc(100% - 3rem), var(--fade-r));
}
.inspiracje--karuzela .inspiracje__grid::-webkit-scrollbar { display: none; }
.karuzela.can-prev .inspiracje__grid { --fade-l: transparent; }
.karuzela.can-next .inspiracje__grid { --fade-r: transparent; }
.inspiracje--karuzela .inspiracje__grid > li { flex: none; width: calc(var(--ar, .8) * var(--h)); max-width: 100%; scroll-snap-align: start; }
.inspiracje--karuzela .inspiracja__open { aspect-ratio: auto; }
.inspiracje--karuzela .inspiracja__open img { height: auto; }
.karuzela__nav {
	position: absolute; top: calc(var(--h) / 2); z-index: 2; translate: 0 -50%;
	display: grid; place-items: center; width: 2.75rem; height: 2.75rem; padding: 0;
	border: 1px solid var(--line); border-radius: 50%; background: #fff; color: var(--ink);
	box-shadow: var(--shadow-lift); cursor: pointer;
	opacity: 0; visibility: hidden; transition: opacity .2s ease, visibility .2s, border-color .15s ease;
}
.karuzela__nav:hover { border-color: var(--ink); }
.karuzela__nav .icon { width: 1.2rem; height: 1.2rem; stroke-width: 2; }
.karuzela__nav--prev { left: -.5rem; }
.karuzela__nav--prev .icon { rotate: 180deg; }
.karuzela__nav--next { right: -.5rem; }
.karuzela.can-prev .karuzela__nav--prev, .karuzela.can-next .karuzela__nav--next { opacity: 1; visibility: visible; }
@media (max-width: 640px) {
	.karuzela { --h: 16rem; }
	.inspiracje--karuzela .inspiracja figcaption { font-size: .8125rem; }
	.inspiracje--karuzela .inspiracja figcaption strong { font-size: .9375rem; }
}

/* ---------- Ilustracja wnętrza ---------- */

.wnetrze { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 1.5rem 2rem; align-items: start; }
.wnetrze__fig { margin: 0; }
.wnetrze__fig a { display: block; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; background: #fff; }
.wnetrze__fig figcaption { margin-top: .625rem; color: var(--muted); font-size: var(--step--1); }
.wnetrze .gfk { margin: 0; }
@media (max-width: 860px) { .wnetrze { grid-template-columns: 1fr; } }

.shop-more .wnetrze { margin-top: 2rem; }

/* ---------- Powiększenie (inspiracje, wnętrze) — osobne od okna zdjęć z opinii (.lightbox) ---------- */

.powieksz {
	width: min(56rem, calc(100vw - 2rem));
	max-height: calc(100vh - 2rem);
	padding: 0;
	border: 0;
	border-radius: var(--radius-l);
	background: #fff;
	color: var(--text);
	overflow: auto;
}
.powieksz::backdrop { background: rgba(7, 30, 61, .72); }
.powieksz__inner { position: relative; padding: 1rem 1rem 1.25rem; }
.powieksz img { width: 100%; height: auto; max-height: calc(100vh - 12rem); object-fit: contain; border-radius: var(--radius-s); background: var(--mist); }
.powieksz__caption { margin: .875rem .25rem 0; font-size: var(--step--1); line-height: 1.5; }
.powieksz__caption strong { display: block; color: var(--ink); font-size: var(--step-0); }
.powieksz__close {
	position: absolute;
	right: 1.5rem;
	top: 1.5rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.75rem;
	height: 2.75rem;
	border: 0;
	border-radius: 50%;
	background: #fff;
	color: var(--ink);
	box-shadow: var(--shadow-lift);
	cursor: pointer;
}
.powieksz__close .icon { width: 1.25rem; height: 1.25rem; }

/* ---------- Tabela danych technicznych w opisie produktu ---------- */

.prose table {
	width: 100%;
	margin: 1rem 0 1.5rem;
	border-collapse: collapse;
	font-size: var(--step--1);
}
.prose caption { text-align: left; color: var(--muted); padding-bottom: .5rem; caption-side: top; }
.prose th, .prose td {
	padding: .625rem .75rem;
	border-bottom: 1px solid var(--line);
	text-align: left;
	vertical-align: top;
	overflow-wrap: anywhere;
}
.prose th[scope="row"] { width: 36%; color: var(--ink); font-weight: 700; }
.prose tr:nth-child(odd) > * { background: var(--mist); }
@media (max-width: 520px) {
	.prose table, .prose tbody, .prose tr, .prose th, .prose td { display: block; width: auto; }
	.prose th[scope="row"] { padding-bottom: 0; border-bottom: 0; width: auto; }
	.prose td { padding-top: .15rem; }
	.prose tr:nth-child(odd) > * { background: var(--mist); }
}

/* ---------- Szczegóły okładki pod opisem (atrybuty spoza tabeli) ---------- */

.specs--krotkie { max-width: 40rem; }

/* ---------- Rozmieszczenie pomocnika na stronach ---------- */

.gfk--oferta { margin: 0 0 1.75rem; }
.shop-filters .gfk--filtry { margin: 1.5rem 0 0; padding: .75rem; gap: .625rem; }
.shop-filters .gfk--filtry .gfk__fig { width: 3.5rem; }
.shop-filters .gfk--filtry .gfk__text { font-size: var(--step--1); font-weight: 600; }
.svc-final__copy .gfk { margin: 1.25rem 0; }
.contact-card .gfk { margin: 1rem 0 .75rem; }
.review-lookup .gfk { margin: .5rem 0 1rem; }
.page-404 .gfk { margin: 1.5rem 0; }
.page-404 .woocommerce-product-search, .page-404 .search-form { margin: 0 0 1.5rem; }
.about-gifciak .gfk { max-width: 46rem; }
.product-page__summary .gfk { margin: 1rem 0; }
.product-details__block--wide { grid-column: 1 / -1; }
.wp-block-woocommerce-cart + .gfk, .gfk + .wp-block-woocommerce-cart { margin-top: 0; }
.wp-block-woocommerce-checkout + .gfk { margin: 1.5rem 0 0; }
.wc-block-cart__empty-cart__title + p + .gfk, .wp-block-woocommerce-empty-cart-block .gfk { margin: 1.25rem auto; }
.woocommerce-order .gfk, .woocommerce-thankyou-order-received + .gfk { margin: 0 0 1.5rem; }

/* ---------- Galeria produktu ---------- */

.product-page__stage { position: relative; }
.stage-photo {
	position: absolute; inset: 0; z-index: 2; margin: 0;
	display: grid; place-items: center;
	padding: clamp(.75rem, 2vw, 1.5rem);
	border-radius: inherit; background: var(--mist);
}
.stage-photo[hidden] { display: none; }
.stage-photo__zoom { display: grid; place-items: center; width: 100%; height: 100%; padding: 0; border: 0; background: none; cursor: zoom-in; touch-action: pan-y; }
.stage-photo__zoom img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; border-radius: var(--radius-s); box-shadow: var(--shadow-lift); background: #fff; }
.stage-nav {
	position: absolute; top: 50%; z-index: 3; translate: 0 -50%;
	display: grid; place-items: center; width: 2.75rem; height: 2.75rem; padding: 0;
	border: 1px solid var(--line); border-radius: 50%; background: rgba(255, 255, 255, .92); color: var(--ink);
	box-shadow: var(--shadow-lift); cursor: pointer; opacity: 0; transition: opacity .2s ease;
}
.stage-nav .icon { width: 1.15rem; height: 1.15rem; }
.stage-nav--prev { left: .75rem; }
.stage-nav--prev .icon { rotate: 180deg; }
.stage-nav--next { right: .75rem; }
.product-page__stage:hover .stage-nav, .stage-nav:focus-visible, .product-page__stage.is-photo .stage-nav { opacity: 1; }
@media (hover: none) { .stage-nav { opacity: 1; } }

/* Miniatury bez paska przewijania: wygaszona krawędź i okrągła strzałka po stronie,
   w którą da się jeszcze przewinąć (main.js ustawia .can-prev / .can-next). */
.product-gallery-wrap { position: relative; margin: .75rem 0 0; }
.product-gallery {
	position: relative; /* ukryte podpisy miniatur zostają w przewijanym pasku, nie poszerzają strony */
	display: flex; gap: .625rem; padding: .25rem .125rem;
	overflow-x: auto; scroll-snap-type: x proximity; scrollbar-width: none;
	--fade-l: #000; --fade-r: #000;
	-webkit-mask-image: linear-gradient(to right, var(--fade-l), #000 3.5rem, #000 calc(100% - 3.5rem), var(--fade-r));
	mask-image: linear-gradient(to right, var(--fade-l), #000 3.5rem, #000 calc(100% - 3.5rem), var(--fade-r));
}
.product-gallery::-webkit-scrollbar { display: none; }
.can-prev > .product-gallery { --fade-l: transparent; }
.can-next > .product-gallery { --fade-r: transparent; }
.product-gallery__nav {
	position: absolute; top: 50%; z-index: 2; translate: 0 -50%;
	display: grid; place-items: center; width: 2.5rem; height: 2.5rem; padding: 0;
	border: 1px solid var(--line); border-radius: 50%; background: #fff; color: var(--ink);
	box-shadow: var(--shadow-lift); cursor: pointer;
	opacity: 0; pointer-events: none; transition: opacity .2s ease, border-color .15s ease;
}
.product-gallery__nav:hover { border-color: var(--ink); }
.product-gallery__nav .icon { width: 1.1rem; height: 1.1rem; stroke-width: 2; }
.product-gallery__nav--prev { left: -.375rem; }
.product-gallery__nav--prev .icon { rotate: 180deg; }
.product-gallery__nav--next { right: -.375rem; }
.can-prev > .product-gallery__nav--prev, .can-next > .product-gallery__nav--next { opacity: 1; pointer-events: auto; }
/* Miniatury na białym polu i bez mieszania z tłem — kolory jak na zdjęciu (kremowy papier
   wnętrza nie szarzeje); obrys z cienia, żeby zaznaczenie nie przesuwało miniatur. */
.product-gallery__thumb {
	flex: 0 0 5.5rem; height: 5.5rem; padding: .25rem; scroll-snap-align: start;
	border: 2px solid transparent; border-radius: var(--radius-s); background: #fff;
	box-shadow: inset 0 0 0 1px var(--line); cursor: pointer;
}
.product-gallery__thumb img { width: 100%; height: 100%; object-fit: contain; }
.product-gallery__thumb:hover { border-color: #9aa7ba; }
.product-gallery__thumb[aria-pressed="true"] { border-color: var(--ink); }
/* Okładka z wzorem: pole o proporcjach zdjęcia, maska wzoru liczy się od jego krawędzi */
.product-gallery__cover { position: relative; display: block; height: 100%; max-width: 100%; margin-inline: auto; }
.product-gallery__thumb:focus-visible { outline: 3px solid var(--gold); outline-offset: 2px; }
.product-gallery__caption { margin: .25rem 0 0; color: var(--muted); font-size: var(--step--1); }
@media (max-width: 900px) { .product-gallery__thumb { flex-basis: 4.5rem; height: 4.5rem; } }

/* ---------- Gifciak „na żywo”: warstwy pozy (assets/js/gifciak.js) ---------- */

.gfk__fig.has-rig > .gfk__img { visibility: hidden; }
.gfk-rig { position: absolute; inset: 0; pointer-events: none; }
.gfk-rig__cialo, .gfk-rig__w, .gfk-rig__oczy { position: absolute; inset: 0; width: 100%; height: 100%; }
.gfk-rig__w { display: block; max-width: none; user-select: none; }
.gfk-rig__cialo, .gfk-rig__w { will-change: transform; }
.gfk-rig__oczy {
	-webkit-mask-size: 100% 100%; mask-size: 100% 100%;
	-webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
	overflow: hidden;
}
/* Powieka: kształt w kolorze skóry z zaokrąglonym brzegiem i rzęsową kreską; zjeżdża na oko przy mrugnięciu. */
.gfk-rig__powieka {
	position: absolute; display: block;
	transform: translateY(-104%);
	border-radius: 0 0 50% 50% / 0 0 38% 38%;
	background:
		radial-gradient(120% 80% at 50% 0%, color-mix(in srgb, var(--skora) 80%, #fff 20%), var(--skora) 70%);
	/* 1em = 1% szerokości postaci (gifciak.js), więc cień skaluje się razem z nią */
	box-shadow: inset 0 -.55em .7em -.25em rgba(5, 12, 28, .8), 0 .3em .6em rgba(5, 12, 28, .35);
	will-change: transform;
}

.gfk__fig { isolation: isolate; }
.gfk__pauza {
	position: absolute; z-index: 2;
	display: grid; place-items: center;
	width: 1.75rem; height: 1.75rem; padding: 0; margin: 0;
	border: 1px solid var(--line); border-radius: 50%;
	background: rgba(255, 255, 255, .92); color: var(--ink);
	opacity: .0; transition: opacity .2s ease; cursor: pointer;
}
.gfk__pauza svg { width: .9rem; height: .9rem; }
.gfk__pauza .s, .gfk__pauza[aria-pressed="true"] .p { display: none; }
.gfk__pauza[aria-pressed="true"] .s { display: inline; }
.gfk:hover .gfk__pauza, .gfk__pauza:focus-visible, .gfk__pauza[aria-pressed="true"] { opacity: 1; }
@media (hover: none) { .gfk__pauza { opacity: .75; } }
.gfk { position: relative; }
.gfk__fig + .gfk__pauza { left: .35rem; top: .35rem; }

/* ==========================================================================
   Strona główna: „pracownia na żywo” (template-parts/hero-studio.php)
   Jasne tło, granat i złoto; ruch tylko w pokazie napisów i u Gifciaka.
   ========================================================================== */

.studio-hero {
	position: relative;
	padding: clamp(2rem, 5vw, 4.5rem) 0 clamp(3rem, 6vw, 5.5rem);
	background:
		radial-gradient(60rem 30rem at 85% 35%, rgba(196, 154, 94, .14), transparent 60%),
		linear-gradient(180deg, #fff 0%, var(--mist) 100%);
	overflow: clip;
}
.studio { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: clamp(2rem, 6vw, 6rem); align-items: center; }

.studio__eyebrow { margin-bottom: 1rem; }
.studio__title {
	margin: 0 0 .45em;
	font-size: clamp(2.75rem, 1.2rem + 4.6vw, 5.75rem);
	font-weight: 800; line-height: 1.02; letter-spacing: -.045em;
}
.studio__mark { position: relative; display: inline-block; padding: .02em .16em .1em; margin-left: .04em; }
.studio__mark > .mark-frame { border-width: 2.5px; }
.studio__mark > .mark-frame i { width: .625rem; height: .625rem; }
.studio__lead { max-width: 34rem; margin: 0 0 1.75rem; color: var(--muted); font-size: var(--step-1); line-height: 1.6; }
.studio__actions { display: flex; flex-wrap: wrap; gap: .75rem; margin: 0 0 1.75rem; }
.studio__facts {
	display: grid; grid-template-columns: repeat(2, minmax(0, max-content)); gap: .625rem 1.75rem;
	margin: 0; padding: 1.25rem 0 0; list-style: none; border-top: 1px solid var(--line);
	font-size: var(--step--1); font-weight: 600; color: var(--ink);
}
.studio__facts li { display: flex; align-items: center; gap: .5rem; }
.studio__facts .icon { width: 1.15rem; height: 1.15rem; color: var(--gold-text); flex: none; }
.studio-hero .trust { margin-top: 1.25rem; }

.studio__stage { position: relative; display: flex; justify-content: center; }
.studio__glow {
	position: absolute; inset: 8% 4% 10%; border-radius: 50%;
	background: radial-gradient(closest-side, rgba(196, 154, 94, .28), rgba(196, 154, 94, 0));
	filter: blur(10px); pointer-events: none;
}
.studio__card {
	position: relative; width: min(100%, 31rem);
	padding: 1.25rem 1.25rem 1.375rem;
	border-radius: 1.75rem;
	background: rgba(255, 255, 255, .86);
	-webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
	border: 1px solid rgba(217, 224, 234, .9);
	box-shadow: 0 2px 4px rgba(7, 30, 61, .05), 0 24px 60px -12px rgba(7, 30, 61, .22);
}
.studio__badge {
	position: absolute; top: 1rem; left: 1rem; z-index: 2; margin: 0;
	display: inline-flex; align-items: center; gap: .45rem;
	padding: .3rem .7rem; border-radius: 999px;
	background: #fff; border: 1px solid var(--line);
	font-size: .8125rem; font-weight: 700; color: var(--ink);
}
.studio__dot { width: .5rem; height: .5rem; border-radius: 50%; background: var(--gold); box-shadow: 0 0 0 0 rgba(196, 154, 94, .6); }
.preview--hero { max-width: 21rem; margin: .75rem auto 0; }
.preview--hero .preview__img { border-radius: .5rem; }

.studio__try { margin: 1.25rem 0 0; }
.studio__label { display: block; margin: 0 0 .5rem; font-size: var(--step--1); font-weight: 700; color: var(--ink); }
.studio__row { display: flex; gap: .5rem; }
.studio__input {
	flex: 1; min-width: 0; height: 3rem; padding: 0 1rem;
	border: 1.5px solid var(--line); border-radius: 999px; background: #fff;
	font: inherit; font-size: var(--step-0); color: var(--ink);
}
.studio__input:focus { outline: none; border-color: var(--ink); box-shadow: 0 0 0 3px rgba(196, 154, 94, .35); }
.studio__row .btn { height: 3rem; min-height: 3rem; border-radius: 999px; padding-inline: 1.4rem; }
.studio__colors { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin: .875rem 0 0; padding: 0; border: 0; }
.studio__swatch { position: relative; cursor: pointer; }
.studio__swatch input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.studio__swatch::before {
	content: ""; display: block; width: 1.75rem; height: 1.75rem; border-radius: 50%;
	background: var(--swatch); box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .15), 0 0 0 2px #fff, 0 0 0 3px var(--line);
}
.studio__swatch:has(input:checked)::before { box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .15), 0 0 0 2px #fff, 0 0 0 4px var(--ink); }
.studio__swatch:has(input:focus-visible)::before { outline: 3px solid var(--gold); outline-offset: 5px; }
.studio__color-name { margin-left: .375rem; font-size: var(--step--1); color: var(--muted); }

/* Gifciak przy okładce: stoi obok (nie na formularzu), z dymkiem nad głową */
.gfk.gfk--hero {
	position: absolute; left: -5.75rem; top: 16%; z-index: 3;
	flex-direction: column; align-items: flex-start; gap: .375rem;
	width: 12.5rem; margin: 0; padding: 0; background: none; border: 0; max-width: none;
}
.gfk--hero .gfk__fig { width: 9.5rem; margin-left: .5rem; }
.gfk--hero .gfk__body {
	order: -1; position: relative;
	padding: .7rem .85rem; border-radius: 1rem; background: #fff; border: 1px solid var(--line);
	box-shadow: 0 10px 24px -10px rgba(7, 30, 61, .28);
}
.gfk--hero .gfk__body::after {
	content: ""; position: absolute; left: 3.25rem; bottom: -.45rem; width: .8rem; height: .8rem;
	background: #fff; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); rotate: 45deg;
}
.gfk--hero .gfk__text { font-size: var(--step--1); }
.gfk--hero .gfk__actions { margin-top: .35rem; font-size: var(--step--1); }

@media (prefers-reduced-motion: no-preference) {
	.studio__dot { animation: studio-puls 2s ease-out infinite; }
	.studio-hero.is-own .studio__dot { animation: none; }
}
@keyframes studio-puls {
	0% { box-shadow: 0 0 0 0 rgba(196, 154, 94, .55); }
	80%, 100% { box-shadow: 0 0 0 .55rem rgba(196, 154, 94, 0); }
}

/*
 * Do 1279 px karta jest za wąska, żeby Gifciak stał obok okładki: stoi nad kartą,
 * z dymkiem obok — niczego nie zasłania (ani okładki, ani pola na napis).
 */
@media (max-width: 1279px) {
	.studio__stage { flex-direction: column; align-items: center; }
	.gfk.gfk--hero {
		position: relative; left: auto; top: auto; order: -1;
		flex-direction: row; align-items: flex-end; width: min(100%, 31rem); margin: 0 0 -.5rem; gap: .5rem;
	}
	.gfk--hero .gfk__fig { width: 6rem; margin: 0; }
	.gfk--hero .gfk__body { order: 0; flex: 1; }
	.gfk--hero .gfk__body::after { left: -.45rem; bottom: 1.5rem; border-right: 0; border-top: 1px solid var(--line); }
	.preview--hero { max-width: 18rem; }
}
@media (max-width: 1023px) {
	.studio { grid-template-columns: 1fr; }
	.studio__copy { text-align: left; }
	.preview--hero { max-width: 21rem; }
}
@media (max-width: 520px) {
	.studio__facts { grid-template-columns: 1fr; }
	.studio__actions .btn { flex: 1 1 12rem; }
	.studio__card { padding: 1rem .875rem 1.125rem; border-radius: 1.25rem; }
	.studio__row { flex-direction: column; }
	.studio__row .btn { width: 100%; }
}

/* Hero: motyw na okładce i napis u dołu */
.studio-art {
	position: absolute; left: 27%; top: 27%; width: 46%; height: 33%;
	color: var(--engrave, #b9a27a);
	filter: drop-shadow(0 -1px 0 rgba(0, 0, 0, .45)) drop-shadow(0 1px 0 rgba(255, 255, 255, .12));
	transition: color .35s ease;
	pointer-events: none;
}
.studio-art__motyw { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; }
.studio-art__motyw.is-active { opacity: 1; }
.studio-art__laser { position: absolute; top: -6%; bottom: -6%; left: 0; width: 3px; opacity: 0; border-radius: 3px;
	background: #fff6e0; box-shadow: 0 0 6px 2px rgba(255, 214, 150, .95), 0 0 18px 6px rgba(255, 170, 80, .55); }
.preview--hero .studio-name { left: 18%; top: 63%; width: 64%; height: 21%; }
@media (prefers-reduced-motion: no-preference) {
	.studio-art.is-burn .studio-art__motyw.is-active { animation: studio-burn 1.25s linear both; }
	.studio-art.is-burn .studio-art__laser { animation: studio-laser 1.25s linear both; }
}
@keyframes studio-burn {
	from { clip-path: inset(0 100% 0 0); filter: brightness(2.2) saturate(.6); }
	85% { filter: brightness(1.4); }
	to { clip-path: inset(0 0 0 0); filter: none; }
}
@keyframes studio-laser {
	0% { left: 0; opacity: 0; }
	6% { opacity: 1; }
	94% { opacity: 1; }
	100% { left: 100%; opacity: 0; }
}

/* Blok w sekcji z produktami: na całą szerokość sekcji, z większą postacią */
.gfk.gfk--oferta { padding: 1rem 1.75rem 1rem 1.25rem; gap: 1.5rem; }
.gfk--oferta .gfk__fig { width: clamp(4.5rem, 7vw, 6.5rem); }
.gfk--oferta .gfk__text { font-size: var(--step-1); }
.gfk--oferta .gfk__actions .gfk__link { padding: .7rem 1.2rem; border-radius: 999px; background: var(--ink); color: #fff; text-decoration: none; }
.gfk--oferta .gfk__actions .gfk__link:hover { background: var(--ink-2); color: #fff; }
.studio__more { margin: .875rem 0 0; font-size: var(--step--1); }