/* ============================================================
   Soleo — Katalog (catalog.css). Port 1:1 z soleo-dev SCSS:
   _categories / _flavors / _product / _card-ish / _product-tile /
   _decoration / _link-arrow. sticker-halo (text-shadow) WYGENEROWANY
   skryptem D:/laragon/tmp/gen-catalog-css.js (em-owy promień 0.167).
   NIE edytować ręcznie tytułów z text-shadow — regenerować skryptem.
   Warstwy zgodne z tokens.css: @layer reset, base, layout, components,
   sections, utilities. Ładowany globalnie (functions.php).
   ============================================================ */

@layer components {
	/* === link-arrow === */
	.link-arrow {
		display: inline-flex;
		align-items: center;
		gap: 0.625rem;
		align-self: flex-start;
		font-family: var(--font-body);
		font-weight: var(--fw-bold);
		font-size: var(--fs-text);
		line-height: var(--lh-normal);
		color: var(--color-brand-blue);
		text-decoration: none;
		transition: color var(--duration-fast) var(--ease-out);
	}
	.link-arrow svg {
		width: 1.75rem;
		height: 1rem;
		flex-shrink: 0;
		transition: transform var(--duration-fast) var(--ease-out);
	}
	.link-arrow:hover,
	.link-arrow:focus-visible { color: var(--color-brand-red); }
	.link-arrow:hover svg,
	.link-arrow:focus-visible svg { transform: translateX(0.5rem); }
	.link-arrow--on-dark { color: var(--color-surface); }
	.link-arrow--on-dark svg { transform: rotate(90deg); }
	.link-arrow--on-dark:hover,
	.link-arrow--on-dark:focus-visible { color: var(--color-surface); }
	.link-arrow--on-dark:hover svg,
	.link-arrow--on-dark:focus-visible svg { transform: rotate(90deg) translateX(0.25rem); }

	/* === decorative squares + clusters === */
	.square {
		display: block;
		width: clamp(2.25rem, 1.7rem + 2.33vw, 4.5rem);
		aspect-ratio: 1;
		will-change: transform;
	}
	.square--blue       { background: var(--color-brand-blue); }
	.square--light-blue { background: var(--color-brand-blue-light); }
	.square--green      { background: var(--color-brand-green); }
	.square--red        { background: var(--color-brand-red); }
	.square--yellow     { background: var(--color-brand-yellow); }

	.section-deco {
		position: absolute;
		right: clamp(0rem, 2.7vw, 3.25rem);
		width: clamp(6rem, 3rem + 6vw, 11.875rem);
		height: auto;
		pointer-events: none;
		z-index: -1;
	}
	@media (max-width: 47.99rem) { .section-deco { display: none; } }

	.deco-cluster .square { position: absolute; }
	.deco-cluster--k2 { aspect-ratio: 190 / 330; }
	.deco-cluster--k2 .square:nth-child(1) { left: 0;       top: 56.594%; width: 76%; }
	.deco-cluster--k2 .square:nth-child(2) { left: 50%;     top: 19.676%; width: 50%; }
	.deco-cluster--k2 .square:nth-child(3) { left: 37.999%; top: 0;       width: 20%; }
	.deco-cluster--k4 { aspect-ratio: 265 / 120; }
	.deco-cluster--k4 .square:nth-child(1) { left: 0;       top: 0;       width: 17.561%; }
	.deco-cluster--k4 .square:nth-child(2) { left: 82.439%; top: 35.484%; width: 17.561%; }
	.deco-cluster--k4 .square:nth-child(3) { left: 46.829%; top: 22.581%; width: 15.609%; }
	.deco-cluster--k4 .square:nth-child(4) { left: 17.561%; top: 69.893%; width: 13.658%; }

	/* === accordion compact (product) === */
	.accordion--compact .accordion__title {
		font-weight: var(--fw-medium);
		font-size: var(--fs-h4);
		color: var(--color-text);
	}

	/* === product-tile === */
	.product-tile {
		position: relative;
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		gap: clamp(1.5rem, 1.09rem + 1.77vw, 2.5rem);
		cursor: pointer;
	}
	.product-tile__text {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		gap: clamp(0.75rem, 0.54rem + 0.88vw, 1.25rem);
		width: 100%;
	}
	@media (max-width: 47.99rem) { .product-tile__text { margin-block: 1.2rem; } }
	.product-tile__media {
		position: relative;
		width: 50%;
		aspect-ratio: 9 / 16;
		overflow: visible;
		margin: 0 auto;
	}
	.product-tile__media__pack {
		position: relative;
		z-index: 2;
		width: 100%;
		height: 100%;
		object-fit: contain;
		object-position: center;
		transform-origin: 50% 60%;
		transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
	}
	.product-tile__deco {
		position: absolute;
		z-index: 0;
		top: 20%;
		right: -10%;
		width: 100%;
		aspect-ratio: 1 / 1;
		object-fit: contain;
		opacity: 0;
		transform: scale(0.5);
		transform-origin: center left;
		transition: opacity 0.5s cubic-bezier(0.4, 0, 0.2, 1), transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
		pointer-events: none;
	}
	.product-tile__deco-2 {
		position: absolute;
		z-index: 0;
		top: 10%;
		left: 70%;
		width: 40%;
		aspect-ratio: 1 / 1;
		object-fit: contain;
		opacity: 0;
		transform: scale(0.5);
		transform-origin: center left;
		transition: opacity 0.5s cubic-bezier(0.4, 0, 0.2, 1), transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
		pointer-events: none;
	}
	@media (prefers-reduced-motion: no-preference) and (hover: hover) {
		.product-tile:hover .product-tile__media__pack,
		.product-tile:focus-within .product-tile__media__pack { transform: rotate(-8deg) translateX(-8%); }
		.product-tile:hover .product-tile__deco,
		.product-tile:focus-within .product-tile__deco,
		.product-tile:hover .product-tile__deco-2,
		.product-tile:focus-within .product-tile__deco-2 { opacity: 1; transform: scale(1.5); }
	}
	@media (max-width: 47.99rem) and (prefers-reduced-motion: no-preference) {
		.product-tile.is-active .product-tile__media__pack { transform: rotate(-8deg) translateX(-8%); }
		.product-tile.is-active .product-tile__deco,
		.product-tile.is-active .product-tile__deco-2 { opacity: 1; transform: scale(1.5); }
	}
	.product-tile__title {
		font-family: var(--font-body);
		font-weight: var(--fw-extrabold);
		font-size: 1.375rem;
		line-height: var(--lh-normal);
		color: var(--color-text);
		text-transform: none;
	}
	@media (min-width: 48rem) { .product-tile__title { font-size: 2.25rem; } }
	.product-tile__desc {
		color: var(--color-text);
		font-size: var(--fs-text);
		font-weight: var(--fw-medium);
		line-height: var(--lh-normal);
	}
	.product-tile__cta {
		margin-top: auto;
		color: var(--color-brand-blue);
		font-weight: var(--fw-bold);
		font-size: 1.5rem;
		text-decoration: none;
		display: inline-flex;
		align-items: center;
		gap: 0.5rem;
		transition: color 0.3s ease-in-out;
		text-wrap: nowrap;
	}
	.product-tile__cta::after {
		content: "";
		display: inline-block;
		width: 1.75rem;
		height: 1rem;
		background-color: currentColor;
		mask-image: url("../images/arrow-cta.svg");
		-webkit-mask-image: url("../images/arrow-cta.svg");
		mask-repeat: no-repeat;
		-webkit-mask-repeat: no-repeat;
		mask-size: contain;
		-webkit-mask-size: contain;
		mask-position: center;
		-webkit-mask-position: center;
		transition: transform 0.3s ease-in-out;
	}
	.product-tile__cta:hover { color: var(--color-brand-red); }
	.product-tile__cta:hover::after { transform: translateX(20px); }

	/* product-carousel mobile (swiper zniszczony <600px) — pionowy stos. */
	@media (max-width: 37.49rem) {
		.product-carousel:not(.swiper-initialized) .swiper-wrapper { flex-direction: column; }
	}
}

@layer sections {
	/* ===================== Categories (landing) ===================== */
	.categories-hero {
		position: relative;
		overflow-x: clip;
		overflow-y: visible;
		/* Domyślnie PŁASKI kolor (sterowany z bloku: heroBgColor). Grafika tła jest
		   opcjonalna — użytkownik wgrywa ją w bloku (heroBgImage), wtedy render
		   dorzuca inline background-image, a size/position/repeat ją dopasują. */
		background-color: var(--color-brand-yellow);
		background-size: cover;
		background-position: center;
		background-repeat: no-repeat;
		min-height: clamp(22rem, 33vw, 40.3125rem);
		display: flex;
		align-items: center;
		justify-content: center;
		padding-block: clamp(6rem, 1rem + 11vw, 15rem) clamp(4rem, 2.25rem + 4.5vw, 9rem);
		padding-inline: var(--container-pad);
		margin-block-end: clamp(2rem, 1rem + 4vw, 6rem);
	}
	@media (max-width: 47.99rem) { .categories-hero { margin-block-end: 0; } }
	@media (max-width: 62.5rem) {
		.categories-hero {
			min-height: 47vw;
			padding-block: clamp(4rem, 2rem + 4vw, 6rem) clamp(3rem, 1.5rem + 3vw, 5rem);
		}
	}
	.categories-hero__title {
		font-size: var(--fs-display-lg);
		margin: 0;
		font-family: var(--font-display);
		font-weight: var(--fw-regular);
		color: var(--color-brand-red-alt);
		text-transform: lowercase;
		line-height: var(--lh-tight);
		position: relative;
		z-index: 1;
		text-align: center;
		text-shadow: 0.167em 0em 1px var(--hero-title-stroke, var(--color-surface)),0.16687em 0.00664em 1px var(--hero-title-stroke, var(--color-surface)),0.16647em 0.01327em 1px var(--hero-title-stroke, var(--color-surface)),0.16581em 0.01988em 1px var(--hero-title-stroke, var(--color-surface)),0.16489em 0.02645em 1px var(--hero-title-stroke, var(--color-surface)),0.16371em 0.03299em 1px var(--hero-title-stroke, var(--color-surface)),0.16227em 0.03947em 1px var(--hero-title-stroke, var(--color-surface)),0.16057em 0.04589em 1px var(--hero-title-stroke, var(--color-surface)),0.15862em 0.05224em 1px var(--hero-title-stroke, var(--color-surface)),0.15642em 0.0585em 1px var(--hero-title-stroke, var(--color-surface)),0.15397em 0.06467em 1px var(--hero-title-stroke, var(--color-surface)),0.15128em 0.07074em 1px var(--hero-title-stroke, var(--color-surface)),0.14834em 0.0767em 1px var(--hero-title-stroke, var(--color-surface)),0.14518em 0.08254em 1px var(--hero-title-stroke, var(--color-surface)),0.14178em 0.08825em 1px var(--hero-title-stroke, var(--color-surface)),0.13816em 0.09381em 1px var(--hero-title-stroke, var(--color-surface)),0.13432em 0.09923em 1px var(--hero-title-stroke, var(--color-surface)),0.13027em 0.10449em 1px var(--hero-title-stroke, var(--color-surface)),0.12601em 0.10959em 1px var(--hero-title-stroke, var(--color-surface)),0.12156em 0.11451em 1px var(--hero-title-stroke, var(--color-surface)),0.11691em 0.11925em 1px var(--hero-title-stroke, var(--color-surface)),0.11207em 0.12381em 1px var(--hero-title-stroke, var(--color-surface)),0.10706em 0.12817em 1px var(--hero-title-stroke, var(--color-surface)),0.10188em 0.13232em 1px var(--hero-title-stroke, var(--color-surface)),0.09654em 0.13627em 1px var(--hero-title-stroke, var(--color-surface)),0.09105em 0.14em 1px var(--hero-title-stroke, var(--color-surface)),0.08541em 0.14351em 1px var(--hero-title-stroke, var(--color-surface)),0.07964em 0.14679em 1px var(--hero-title-stroke, var(--color-surface)),0.07374em 0.14984em 1px var(--hero-title-stroke, var(--color-surface)),0.06772em 0.15265em 1px var(--hero-title-stroke, var(--color-surface)),0.0616em 0.15522em 1px var(--hero-title-stroke, var(--color-surface)),0.05538em 0.15755em 1px var(--hero-title-stroke, var(--color-surface)),0.04907em 0.15963em 1px var(--hero-title-stroke, var(--color-surface)),0.04269em 0.16145em 1px var(--hero-title-stroke, var(--color-surface)),0.03624em 0.16302em 1px var(--hero-title-stroke, var(--color-surface)),0.02973em 0.16433em 1px var(--hero-title-stroke, var(--color-surface)),0.02317em 0.16539em 1px var(--hero-title-stroke, var(--color-surface)),0.01658em 0.16618em 1px var(--hero-title-stroke, var(--color-surface)),0.00996em 0.1667em 1px var(--hero-title-stroke, var(--color-surface)),0.00332em 0.16697em 1px var(--hero-title-stroke, var(--color-surface)),-0.00332em 0.16697em 1px var(--hero-title-stroke, var(--color-surface)),-0.00996em 0.1667em 1px var(--hero-title-stroke, var(--color-surface)),-0.01658em 0.16618em 1px var(--hero-title-stroke, var(--color-surface)),-0.02317em 0.16539em 1px var(--hero-title-stroke, var(--color-surface)),-0.02973em 0.16433em 1px var(--hero-title-stroke, var(--color-surface)),-0.03624em 0.16302em 1px var(--hero-title-stroke, var(--color-surface)),-0.04269em 0.16145em 1px var(--hero-title-stroke, var(--color-surface)),-0.04907em 0.15963em 1px var(--hero-title-stroke, var(--color-surface)),-0.05538em 0.15755em 1px var(--hero-title-stroke, var(--color-surface)),-0.0616em 0.15522em 1px var(--hero-title-stroke, var(--color-surface)),-0.06772em 0.15265em 1px var(--hero-title-stroke, var(--color-surface)),-0.07374em 0.14984em 1px var(--hero-title-stroke, var(--color-surface)),-0.07964em 0.14679em 1px var(--hero-title-stroke, var(--color-surface)),-0.08541em 0.14351em 1px var(--hero-title-stroke, var(--color-surface)),-0.09105em 0.14em 1px var(--hero-title-stroke, var(--color-surface)),-0.09654em 0.13627em 1px var(--hero-title-stroke, var(--color-surface)),-0.10188em 0.13232em 1px var(--hero-title-stroke, var(--color-surface)),-0.10706em 0.12817em 1px var(--hero-title-stroke, var(--color-surface)),-0.11207em 0.12381em 1px var(--hero-title-stroke, var(--color-surface)),-0.11691em 0.11925em 1px var(--hero-title-stroke, var(--color-surface)),-0.12156em 0.11451em 1px var(--hero-title-stroke, var(--color-surface)),-0.12601em 0.10959em 1px var(--hero-title-stroke, var(--color-surface)),-0.13027em 0.10449em 1px var(--hero-title-stroke, var(--color-surface)),-0.13432em 0.09923em 1px var(--hero-title-stroke, var(--color-surface)),-0.13816em 0.09381em 1px var(--hero-title-stroke, var(--color-surface)),-0.14178em 0.08825em 1px var(--hero-title-stroke, var(--color-surface)),-0.14518em 0.08254em 1px var(--hero-title-stroke, var(--color-surface)),-0.14834em 0.0767em 1px var(--hero-title-stroke, var(--color-surface)),-0.15128em 0.07074em 1px var(--hero-title-stroke, var(--color-surface)),-0.15397em 0.06467em 1px var(--hero-title-stroke, var(--color-surface)),-0.15642em 0.0585em 1px var(--hero-title-stroke, var(--color-surface)),-0.15862em 0.05224em 1px var(--hero-title-stroke, var(--color-surface)),-0.16057em 0.04589em 1px var(--hero-title-stroke, var(--color-surface)),-0.16227em 0.03947em 1px var(--hero-title-stroke, var(--color-surface)),-0.16371em 0.03299em 1px var(--hero-title-stroke, var(--color-surface)),-0.16489em 0.02645em 1px var(--hero-title-stroke, var(--color-surface)),-0.16581em 0.01988em 1px var(--hero-title-stroke, var(--color-surface)),-0.16647em 0.01327em 1px var(--hero-title-stroke, var(--color-surface)),-0.16687em 0.00664em 1px var(--hero-title-stroke, var(--color-surface)),-0.167em 0em 1px var(--hero-title-stroke, var(--color-surface)),-0.16687em -0.00664em 1px var(--hero-title-stroke, var(--color-surface)),-0.16647em -0.01327em 1px var(--hero-title-stroke, var(--color-surface)),-0.16581em -0.01988em 1px var(--hero-title-stroke, var(--color-surface)),-0.16489em -0.02645em 1px var(--hero-title-stroke, var(--color-surface)),-0.16371em -0.03299em 1px var(--hero-title-stroke, var(--color-surface)),-0.16227em -0.03947em 1px var(--hero-title-stroke, var(--color-surface)),-0.16057em -0.04589em 1px var(--hero-title-stroke, var(--color-surface)),-0.15862em -0.05224em 1px var(--hero-title-stroke, var(--color-surface)),-0.15642em -0.0585em 1px var(--hero-title-stroke, var(--color-surface)),-0.15397em -0.06467em 1px var(--hero-title-stroke, var(--color-surface)),-0.15128em -0.07074em 1px var(--hero-title-stroke, var(--color-surface)),-0.14834em -0.0767em 1px var(--hero-title-stroke, var(--color-surface)),-0.14518em -0.08254em 1px var(--hero-title-stroke, var(--color-surface)),-0.14178em -0.08825em 1px var(--hero-title-stroke, var(--color-surface)),-0.13816em -0.09381em 1px var(--hero-title-stroke, var(--color-surface)),-0.13432em -0.09923em 1px var(--hero-title-stroke, var(--color-surface)),-0.13027em -0.10449em 1px var(--hero-title-stroke, var(--color-surface)),-0.12601em -0.10959em 1px var(--hero-title-stroke, var(--color-surface)),-0.12156em -0.11451em 1px var(--hero-title-stroke, var(--color-surface)),-0.11691em -0.11925em 1px var(--hero-title-stroke, var(--color-surface)),-0.11207em -0.12381em 1px var(--hero-title-stroke, var(--color-surface)),-0.10706em -0.12817em 1px var(--hero-title-stroke, var(--color-surface)),-0.10188em -0.13232em 1px var(--hero-title-stroke, var(--color-surface)),-0.09654em -0.13627em 1px var(--hero-title-stroke, var(--color-surface)),-0.09105em -0.14em 1px var(--hero-title-stroke, var(--color-surface)),-0.08541em -0.14351em 1px var(--hero-title-stroke, var(--color-surface)),-0.07964em -0.14679em 1px var(--hero-title-stroke, var(--color-surface)),-0.07374em -0.14984em 1px var(--hero-title-stroke, var(--color-surface)),-0.06772em -0.15265em 1px var(--hero-title-stroke, var(--color-surface)),-0.0616em -0.15522em 1px var(--hero-title-stroke, var(--color-surface)),-0.05538em -0.15755em 1px var(--hero-title-stroke, var(--color-surface)),-0.04907em -0.15963em 1px var(--hero-title-stroke, var(--color-surface)),-0.04269em -0.16145em 1px var(--hero-title-stroke, var(--color-surface)),-0.03624em -0.16302em 1px var(--hero-title-stroke, var(--color-surface)),-0.02973em -0.16433em 1px var(--hero-title-stroke, var(--color-surface)),-0.02317em -0.16539em 1px var(--hero-title-stroke, var(--color-surface)),-0.01658em -0.16618em 1px var(--hero-title-stroke, var(--color-surface)),-0.00996em -0.1667em 1px var(--hero-title-stroke, var(--color-surface)),-0.00332em -0.16697em 1px var(--hero-title-stroke, var(--color-surface)),0.00332em -0.16697em 1px var(--hero-title-stroke, var(--color-surface)),0.00996em -0.1667em 1px var(--hero-title-stroke, var(--color-surface)),0.01658em -0.16618em 1px var(--hero-title-stroke, var(--color-surface)),0.02317em -0.16539em 1px var(--hero-title-stroke, var(--color-surface)),0.02973em -0.16433em 1px var(--hero-title-stroke, var(--color-surface)),0.03624em -0.16302em 1px var(--hero-title-stroke, var(--color-surface)),0.04269em -0.16145em 1px var(--hero-title-stroke, var(--color-surface)),0.04907em -0.15963em 1px var(--hero-title-stroke, var(--color-surface)),0.05538em -0.15755em 1px var(--hero-title-stroke, var(--color-surface)),0.0616em -0.15522em 1px var(--hero-title-stroke, var(--color-surface)),0.06772em -0.15265em 1px var(--hero-title-stroke, var(--color-surface)),0.07374em -0.14984em 1px var(--hero-title-stroke, var(--color-surface)),0.07964em -0.14679em 1px var(--hero-title-stroke, var(--color-surface)),0.08541em -0.14351em 1px var(--hero-title-stroke, var(--color-surface)),0.09105em -0.14em 1px var(--hero-title-stroke, var(--color-surface)),0.09654em -0.13627em 1px var(--hero-title-stroke, var(--color-surface)),0.10188em -0.13232em 1px var(--hero-title-stroke, var(--color-surface)),0.10706em -0.12817em 1px var(--hero-title-stroke, var(--color-surface)),0.11207em -0.12381em 1px var(--hero-title-stroke, var(--color-surface)),0.11691em -0.11925em 1px var(--hero-title-stroke, var(--color-surface)),0.12156em -0.11451em 1px var(--hero-title-stroke, var(--color-surface)),0.12601em -0.10959em 1px var(--hero-title-stroke, var(--color-surface)),0.13027em -0.10449em 1px var(--hero-title-stroke, var(--color-surface)),0.13432em -0.09923em 1px var(--hero-title-stroke, var(--color-surface)),0.13816em -0.09381em 1px var(--hero-title-stroke, var(--color-surface)),0.14178em -0.08825em 1px var(--hero-title-stroke, var(--color-surface)),0.14518em -0.08254em 1px var(--hero-title-stroke, var(--color-surface)),0.14834em -0.0767em 1px var(--hero-title-stroke, var(--color-surface)),0.15128em -0.07074em 1px var(--hero-title-stroke, var(--color-surface)),0.15397em -0.06467em 1px var(--hero-title-stroke, var(--color-surface)),0.15642em -0.0585em 1px var(--hero-title-stroke, var(--color-surface)),0.15862em -0.05224em 1px var(--hero-title-stroke, var(--color-surface)),0.16057em -0.04589em 1px var(--hero-title-stroke, var(--color-surface)),0.16227em -0.03947em 1px var(--hero-title-stroke, var(--color-surface)),0.16371em -0.03299em 1px var(--hero-title-stroke, var(--color-surface)),0.16489em -0.02645em 1px var(--hero-title-stroke, var(--color-surface)),0.16581em -0.01988em 1px var(--hero-title-stroke, var(--color-surface)),0.16647em -0.01327em 1px var(--hero-title-stroke, var(--color-surface)),0.16687em -0.00664em 1px var(--hero-title-stroke, var(--color-surface)),0.0835em 0em 1px var(--hero-title-stroke, var(--color-surface)),0.08324em 0.00663em 1px var(--hero-title-stroke, var(--color-surface)),0.08245em 0.01323em 1px var(--hero-title-stroke, var(--color-surface)),0.08113em 0.01973em 1px var(--hero-title-stroke, var(--color-surface)),0.07931em 0.02612em 1px var(--hero-title-stroke, var(--color-surface)),0.07698em 0.03234em 1px var(--hero-title-stroke, var(--color-surface)),0.07417em 0.03835em 1px var(--hero-title-stroke, var(--color-surface)),0.07089em 0.04412em 1px var(--hero-title-stroke, var(--color-surface)),0.06716em 0.04962em 1px var(--hero-title-stroke, var(--color-surface)),0.06301em 0.05479em 1px var(--hero-title-stroke, var(--color-surface)),0.05845em 0.05963em 1px var(--hero-title-stroke, var(--color-surface)),0.05353em 0.06408em 1px var(--hero-title-stroke, var(--color-surface)),0.04827em 0.06813em 1px var(--hero-title-stroke, var(--color-surface)),0.0427em 0.07175em 1px var(--hero-title-stroke, var(--color-surface)),0.03687em 0.07492em 1px var(--hero-title-stroke, var(--color-surface)),0.0308em 0.07761em 1px var(--hero-title-stroke, var(--color-surface)),0.02454em 0.07981em 1px var(--hero-title-stroke, var(--color-surface)),0.01812em 0.08151em 1px var(--hero-title-stroke, var(--color-surface)),0.01158em 0.08269em 1px var(--hero-title-stroke, var(--color-surface)),0.00498em 0.08335em 1px var(--hero-title-stroke, var(--color-surface)),-0.00166em 0.08348em 1px var(--hero-title-stroke, var(--color-surface)),-0.00829em 0.08309em 1px var(--hero-title-stroke, var(--color-surface)),-0.01486em 0.08217em 1px var(--hero-title-stroke, var(--color-surface)),-0.02134em 0.08073em 1px var(--hero-title-stroke, var(--color-surface)),-0.02769em 0.07878em 1px var(--hero-title-stroke, var(--color-surface)),-0.03386em 0.07633em 1px var(--hero-title-stroke, var(--color-surface)),-0.03982em 0.07339em 1px var(--hero-title-stroke, var(--color-surface)),-0.04552em 0.07em 1px var(--hero-title-stroke, var(--color-surface)),-0.05094em 0.06616em 1px var(--hero-title-stroke, var(--color-surface)),-0.05604em 0.0619em 1px var(--hero-title-stroke, var(--color-surface)),-0.06078em 0.05726em 1px var(--hero-title-stroke, var(--color-surface)),-0.06513em 0.05225em 1px var(--hero-title-stroke, var(--color-surface)),-0.06908em 0.04691em 1px var(--hero-title-stroke, var(--color-surface)),-0.07259em 0.04127em 1px var(--hero-title-stroke, var(--color-surface)),-0.07564em 0.03537em 1px var(--hero-title-stroke, var(--color-surface)),-0.07821em 0.02925em 1px var(--hero-title-stroke, var(--color-surface)),-0.08029em 0.02294em 1px var(--hero-title-stroke, var(--color-surface)),-0.08185em 0.01649em 1px var(--hero-title-stroke, var(--color-surface)),-0.08291em 0.00994em 1px var(--hero-title-stroke, var(--color-surface)),-0.08343em 0.00332em 1px var(--hero-title-stroke, var(--color-surface)),-0.08343em -0.00332em 1px var(--hero-title-stroke, var(--color-surface)),-0.08291em -0.00994em 1px var(--hero-title-stroke, var(--color-surface)),-0.08185em -0.01649em 1px var(--hero-title-stroke, var(--color-surface)),-0.08029em -0.02294em 1px var(--hero-title-stroke, var(--color-surface)),-0.07821em -0.02925em 1px var(--hero-title-stroke, var(--color-surface)),-0.07564em -0.03537em 1px var(--hero-title-stroke, var(--color-surface)),-0.07259em -0.04127em 1px var(--hero-title-stroke, var(--color-surface)),-0.06908em -0.04691em 1px var(--hero-title-stroke, var(--color-surface)),-0.06513em -0.05225em 1px var(--hero-title-stroke, var(--color-surface)),-0.06078em -0.05726em 1px var(--hero-title-stroke, var(--color-surface)),-0.05604em -0.0619em 1px var(--hero-title-stroke, var(--color-surface)),-0.05094em -0.06616em 1px var(--hero-title-stroke, var(--color-surface)),-0.04552em -0.07em 1px var(--hero-title-stroke, var(--color-surface)),-0.03982em -0.07339em 1px var(--hero-title-stroke, var(--color-surface)),-0.03386em -0.07633em 1px var(--hero-title-stroke, var(--color-surface)),-0.02769em -0.07878em 1px var(--hero-title-stroke, var(--color-surface)),-0.02134em -0.08073em 1px var(--hero-title-stroke, var(--color-surface)),-0.01486em -0.08217em 1px var(--hero-title-stroke, var(--color-surface)),-0.00829em -0.08309em 1px var(--hero-title-stroke, var(--color-surface)),-0.00166em -0.08348em 1px var(--hero-title-stroke, var(--color-surface)),0.00498em -0.08335em 1px var(--hero-title-stroke, var(--color-surface)),0.01158em -0.08269em 1px var(--hero-title-stroke, var(--color-surface)),0.01812em -0.08151em 1px var(--hero-title-stroke, var(--color-surface)),0.02454em -0.07981em 1px var(--hero-title-stroke, var(--color-surface)),0.0308em -0.07761em 1px var(--hero-title-stroke, var(--color-surface)),0.03687em -0.07492em 1px var(--hero-title-stroke, var(--color-surface)),0.0427em -0.07175em 1px var(--hero-title-stroke, var(--color-surface)),0.04827em -0.06813em 1px var(--hero-title-stroke, var(--color-surface)),0.05353em -0.06408em 1px var(--hero-title-stroke, var(--color-surface)),0.05845em -0.05963em 1px var(--hero-title-stroke, var(--color-surface)),0.06301em -0.05479em 1px var(--hero-title-stroke, var(--color-surface)),0.06716em -0.04962em 1px var(--hero-title-stroke, var(--color-surface)),0.07089em -0.04412em 1px var(--hero-title-stroke, var(--color-surface)),0.07417em -0.03835em 1px var(--hero-title-stroke, var(--color-surface)),0.07698em -0.03234em 1px var(--hero-title-stroke, var(--color-surface)),0.07931em -0.02612em 1px var(--hero-title-stroke, var(--color-surface)),0.08113em -0.01973em 1px var(--hero-title-stroke, var(--color-surface)),0.08245em -0.01323em 1px var(--hero-title-stroke, var(--color-surface)),0.08324em -0.00663em 1px var(--hero-title-stroke, var(--color-surface));
	}
	.categories-hero__title-small { display: block; font-size: var(--fs-display-sm); }
	.categories-hero__title-big   { display: block; font-size: var(--fs-display-lg); }
	.categories-hero__pack {
		position: absolute;
		pointer-events: none;
		user-select: none;
		z-index: 0;
		object-fit: cover;
		object-position: center;
	}
	@media (max-width: 47.99rem) { .categories-hero__pack { display: none; } }
	.categories-hero__pack--1 { left: 10.78vw; width: 13.46vw; height: 21.10vw; transform: rotate(-0.33deg); }
	.categories-hero__pack--2 { left: 0; bottom: -2.80vw; width: 15.12vw; height: 21.86vw; transform: rotate(-5.87deg); }
	.categories-hero__pack--3 { left: 19.70vw; bottom: -5.02vw; width: 16.05vw; height: 23.23vw; transform: rotate(5.76deg); }
	.categories-hero__pack--4 { left: 69.84vw; width: 16.72vw; height: 18.13vw; }
	.categories-hero__pack--5 { left: 83.30vw; width: 19.47vw; height: 19.47vw; transform: rotate(4.37deg); }
	.categories-hero__pack--6 { left: 72.66vw; bottom: -3.77vw; width: 23.21vw; height: 19.24vw; transform: rotate(-7.38deg); }

	.categories-grid { overflow: hidden; }
	.categories-grid__inner {
		display: grid;
		grid-template-columns: 1fr;
		gap: clamp(2rem, 1rem + 3vw, 3.75rem);
	}
	@media (min-width: 60rem) { .categories-grid__inner { grid-template-columns: 1fr 1fr; } }
	.category-card { display: flex; flex-direction: column; }
	.category-card__media {
		position: relative;
		aspect-ratio: 1;
		border-radius: var(--radius-xl);
		overflow: hidden;
	}
	.category-card__media img {
		position: absolute;
		inset: 0;
		width: 100%;
		height: 100%;
		object-fit: cover;
		display: block;
		transition: transform 0.4s ease;
	}
	.category-card:hover .category-card__media img { transform: scale(1.03); }
	.category-card__content {
		display: flex;
		flex-direction: column;
		gap: clamp(1.5rem, 0.5rem + 2.5vw, 3.5rem);
		padding-block: 3rem;
	}
	.category-card__copy {
		display: flex;
		flex-direction: column;
		gap: 1rem;
		align-items: flex-start;
	}
	.category-card__heading {
		margin: 0;
		font-family: var(--font-display);
		font-weight: var(--fw-regular);
		line-height: var(--lh-display);
		color: var(--color-ink);
		text-transform: lowercase;
		position: relative;
		width: fit-content;
		font-size: clamp(3rem, 1.5rem + 6vw, 6.25rem);
	}
	.category-card__ozdobnik {
		position: absolute;
		top: clamp(-1.5rem, -1rem - 1vw, -0.5rem);
		left: 100%;
		transform: translateX(-1rem);
		width: clamp(2.75rem, 1.5rem + 3vw, 6.4375rem);
		height: auto;
		pointer-events: none;
	}
	.category-card__ozdobnik--yellow { color: var(--color-brand-yellow); }
	.category-card__ozdobnik--red    { color: var(--color-brand-red); }
	.category-card__ozdobnik--green  { color: var(--color-brand-green); }
	.category-card__ozdobnik--blue   { color: var(--color-brand-blue); }
	.category-card__description {
		margin: 0;
		font-family: var(--font-body);
		font-weight: var(--fw-medium);
		font-size: var(--fs-text);
		line-height: var(--lh-normal);
		color: var(--color-text);
		max-width: none;
	}
	.category-card__cta { align-self: flex-start; }
	.categories-grid__deco { top: clamp(20rem, 54.32vw, 65.1875rem); bottom: auto; }

	/* ===================== Flavors hero + section ===================== */
	.flavors-hero {
		position: relative;
		background-color: var(--color-brand-red);
		color: var(--color-surface);
		overflow: hidden;
	}
	.flavors-hero::before {
		content: "";
		position: absolute;
		inset: 0;
		background: url("../images/flavors/hero-texture.jpg") center / cover no-repeat;
		opacity: 0.2;
		pointer-events: none;
		z-index: 0;
	}
	.flavors-hero__inner {
		position: relative;
		z-index: 1;
		display: flex;
		flex-direction: column;
		padding-top: clamp(5rem, 3rem + 5vw, 8rem);
	}
	@media (min-width: 62.5rem) {
		.flavors-hero__inner { display: grid; grid-template-columns: 1fr auto; align-items: stretch; }
	}
	.flavors-hero__content {
		flex: 1 1 auto;
		display: flex;
		flex-direction: column;
		justify-content: center;
		gap: clamp(1.5rem, 0.5rem + 2.5vw, 3.5rem);
		padding: clamp(2.5rem, 1rem + 6vw, 7.5rem) var(--container-pad);
	}
	@media (min-width: 62.5rem) {
		.flavors-hero__content {
			padding-block: clamp(8rem, 4rem + 8vw, 7.5rem);
			padding-inline: var(--container-pad) clamp(2rem, 6vw, 7.5rem);
		}
	}
	.flavors-hero__title {
		margin: 0;
		font-family: var(--font-display);
		font-weight: var(--fw-regular);
		color: var(--color-brand-red);
		text-transform: lowercase;
		line-height: var(--lh-tight);
		font-size: var(--fs-h2);
		text-shadow: 0.167em 0em 1px var(--flavors-title-stroke, var(--color-surface)),0.1667em 0.00999em 1px var(--flavors-title-stroke, var(--color-surface)),0.16581em 0.01994em 1px var(--flavors-title-stroke, var(--color-surface)),0.16432em 0.02982em 1px var(--flavors-title-stroke, var(--color-surface)),0.16224em 0.03959em 1px var(--flavors-title-stroke, var(--color-surface)),0.15958em 0.04922em 1px var(--flavors-title-stroke, var(--color-surface)),0.15635em 0.05868em 1px var(--flavors-title-stroke, var(--color-surface)),0.15256em 0.06793em 1px var(--flavors-title-stroke, var(--color-surface)),0.14823em 0.07693em 1px var(--flavors-title-stroke, var(--color-surface)),0.14336em 0.08565em 1px var(--flavors-title-stroke, var(--color-surface)),0.13798em 0.09407em 1px var(--flavors-title-stroke, var(--color-surface)),0.13211em 0.10216em 1px var(--flavors-title-stroke, var(--color-surface)),0.12576em 0.10988em 1px var(--flavors-title-stroke, var(--color-surface)),0.11897em 0.1172em 1px var(--flavors-title-stroke, var(--color-surface)),0.11174em 0.12411em 1px var(--flavors-title-stroke, var(--color-surface)),0.10412em 0.13057em 1px var(--flavors-title-stroke, var(--color-surface)),0.09613em 0.13656em 1px var(--flavors-title-stroke, var(--color-surface)),0.08779em 0.14206em 1px var(--flavors-title-stroke, var(--color-surface)),0.07914em 0.14706em 1px var(--flavors-title-stroke, var(--color-surface)),0.0702em 0.15153em 1px var(--flavors-title-stroke, var(--color-surface)),0.06101em 0.15546em 1px var(--flavors-title-stroke, var(--color-surface)),0.05161em 0.15883em 1px var(--flavors-title-stroke, var(--color-surface)),0.04201em 0.16163em 1px var(--flavors-title-stroke, var(--color-surface)),0.03227em 0.16385em 1px var(--flavors-title-stroke, var(--color-surface)),0.02242em 0.16549em 1px var(--flavors-title-stroke, var(--color-surface)),0.01248em 0.16653em 1px var(--flavors-title-stroke, var(--color-surface)),0.0025em 0.16698em 1px var(--flavors-title-stroke, var(--color-surface)),-0.00749em 0.16683em 1px var(--flavors-title-stroke, var(--color-surface)),-0.01746em 0.16609em 1px var(--flavors-title-stroke, var(--color-surface)),-0.02736em 0.16474em 1px var(--flavors-title-stroke, var(--color-surface)),-0.03716em 0.16281em 1px var(--flavors-title-stroke, var(--color-surface)),-0.04683em 0.1603em 1px var(--flavors-title-stroke, var(--color-surface)),-0.05633em 0.15721em 1px var(--flavors-title-stroke, var(--color-surface)),-0.06564em 0.15356em 1px var(--flavors-title-stroke, var(--color-surface)),-0.0747em 0.14936em 1px var(--flavors-title-stroke, var(--color-surface)),-0.0835em 0.14463em 1px var(--flavors-title-stroke, var(--color-surface)),-0.092em 0.13937em 1px var(--flavors-title-stroke, var(--color-surface)),-0.10017em 0.13362em 1px var(--flavors-title-stroke, var(--color-surface)),-0.10798em 0.12739em 1px var(--flavors-title-stroke, var(--color-surface)),-0.11541em 0.12071em 1px var(--flavors-title-stroke, var(--color-surface)),-0.12242em 0.11359em 1px var(--flavors-title-stroke, var(--color-surface)),-0.12899em 0.10606em 1px var(--flavors-title-stroke, var(--color-surface)),-0.13511em 0.09816em 1px var(--flavors-title-stroke, var(--color-surface)),-0.14073em 0.0899em 1px var(--flavors-title-stroke, var(--color-surface)),-0.14586em 0.08133em 1px var(--flavors-title-stroke, var(--color-surface)),-0.15046em 0.07246em 1px var(--flavors-title-stroke, var(--color-surface)),-0.15453em 0.06333em 1px var(--flavors-title-stroke, var(--color-surface)),-0.15804em 0.05398em 1px var(--flavors-title-stroke, var(--color-surface)),-0.16098em 0.04443em 1px var(--flavors-title-stroke, var(--color-surface)),-0.16335em 0.03472em 1px var(--flavors-title-stroke, var(--color-surface)),-0.16513em 0.02489em 1px var(--flavors-title-stroke, var(--color-surface)),-0.16633em 0.01497em 1px var(--flavors-title-stroke, var(--color-surface)),-0.16693em 0.005em 1px var(--flavors-title-stroke, var(--color-surface)),-0.16693em -0.005em 1px var(--flavors-title-stroke, var(--color-surface)),-0.16633em -0.01497em 1px var(--flavors-title-stroke, var(--color-surface)),-0.16513em -0.02489em 1px var(--flavors-title-stroke, var(--color-surface)),-0.16335em -0.03472em 1px var(--flavors-title-stroke, var(--color-surface)),-0.16098em -0.04443em 1px var(--flavors-title-stroke, var(--color-surface)),-0.15804em -0.05398em 1px var(--flavors-title-stroke, var(--color-surface)),-0.15453em -0.06333em 1px var(--flavors-title-stroke, var(--color-surface)),-0.15046em -0.07246em 1px var(--flavors-title-stroke, var(--color-surface)),-0.14586em -0.08133em 1px var(--flavors-title-stroke, var(--color-surface)),-0.14073em -0.0899em 1px var(--flavors-title-stroke, var(--color-surface)),-0.13511em -0.09816em 1px var(--flavors-title-stroke, var(--color-surface)),-0.12899em -0.10606em 1px var(--flavors-title-stroke, var(--color-surface)),-0.12242em -0.11359em 1px var(--flavors-title-stroke, var(--color-surface)),-0.11541em -0.12071em 1px var(--flavors-title-stroke, var(--color-surface)),-0.10798em -0.12739em 1px var(--flavors-title-stroke, var(--color-surface)),-0.10017em -0.13362em 1px var(--flavors-title-stroke, var(--color-surface)),-0.092em -0.13937em 1px var(--flavors-title-stroke, var(--color-surface)),-0.0835em -0.14463em 1px var(--flavors-title-stroke, var(--color-surface)),-0.0747em -0.14936em 1px var(--flavors-title-stroke, var(--color-surface)),-0.06564em -0.15356em 1px var(--flavors-title-stroke, var(--color-surface)),-0.05633em -0.15721em 1px var(--flavors-title-stroke, var(--color-surface)),-0.04683em -0.1603em 1px var(--flavors-title-stroke, var(--color-surface)),-0.03716em -0.16281em 1px var(--flavors-title-stroke, var(--color-surface)),-0.02736em -0.16474em 1px var(--flavors-title-stroke, var(--color-surface)),-0.01746em -0.16609em 1px var(--flavors-title-stroke, var(--color-surface)),-0.00749em -0.16683em 1px var(--flavors-title-stroke, var(--color-surface)),0.0025em -0.16698em 1px var(--flavors-title-stroke, var(--color-surface)),0.01248em -0.16653em 1px var(--flavors-title-stroke, var(--color-surface)),0.02242em -0.16549em 1px var(--flavors-title-stroke, var(--color-surface)),0.03227em -0.16385em 1px var(--flavors-title-stroke, var(--color-surface)),0.04201em -0.16163em 1px var(--flavors-title-stroke, var(--color-surface)),0.05161em -0.15883em 1px var(--flavors-title-stroke, var(--color-surface)),0.06101em -0.15546em 1px var(--flavors-title-stroke, var(--color-surface)),0.0702em -0.15153em 1px var(--flavors-title-stroke, var(--color-surface)),0.07914em -0.14706em 1px var(--flavors-title-stroke, var(--color-surface)),0.08779em -0.14206em 1px var(--flavors-title-stroke, var(--color-surface)),0.09613em -0.13656em 1px var(--flavors-title-stroke, var(--color-surface)),0.10412em -0.13057em 1px var(--flavors-title-stroke, var(--color-surface)),0.11174em -0.12411em 1px var(--flavors-title-stroke, var(--color-surface)),0.11897em -0.1172em 1px var(--flavors-title-stroke, var(--color-surface)),0.12576em -0.10988em 1px var(--flavors-title-stroke, var(--color-surface)),0.13211em -0.10216em 1px var(--flavors-title-stroke, var(--color-surface)),0.13798em -0.09407em 1px var(--flavors-title-stroke, var(--color-surface)),0.14336em -0.08565em 1px var(--flavors-title-stroke, var(--color-surface)),0.14823em -0.07693em 1px var(--flavors-title-stroke, var(--color-surface)),0.15256em -0.06793em 1px var(--flavors-title-stroke, var(--color-surface)),0.15635em -0.05868em 1px var(--flavors-title-stroke, var(--color-surface)),0.15958em -0.04922em 1px var(--flavors-title-stroke, var(--color-surface)),0.16224em -0.03959em 1px var(--flavors-title-stroke, var(--color-surface)),0.16432em -0.02982em 1px var(--flavors-title-stroke, var(--color-surface)),0.16581em -0.01994em 1px var(--flavors-title-stroke, var(--color-surface)),0.1667em -0.00999em 1px var(--flavors-title-stroke, var(--color-surface)),0.0835em 0em 1px var(--flavors-title-stroke, var(--color-surface)),0.08291em 0.00988em 1px var(--flavors-title-stroke, var(--color-surface)),0.08116em 0.01961em 1px var(--flavors-title-stroke, var(--color-surface)),0.07827em 0.02907em 1px var(--flavors-title-stroke, var(--color-surface)),0.07429em 0.03813em 1px var(--flavors-title-stroke, var(--color-surface)),0.06926em 0.04665em 1px var(--flavors-title-stroke, var(--color-surface)),0.06325em 0.05451em 1px var(--flavors-title-stroke, var(--color-surface)),0.05636em 0.06161em 1px var(--flavors-title-stroke, var(--color-surface)),0.04868em 0.06784em 1px var(--flavors-title-stroke, var(--color-surface)),0.04031em 0.07312em 1px var(--flavors-title-stroke, var(--color-surface)),0.03138em 0.07738em 1px var(--flavors-title-stroke, var(--color-surface)),0.02201em 0.08055em 1px var(--flavors-title-stroke, var(--color-surface)),0.01233em 0.08258em 1px var(--flavors-title-stroke, var(--color-surface)),0.00247em 0.08346em 1px var(--flavors-title-stroke, var(--color-surface)),-0.00741em 0.08317em 1px var(--flavors-title-stroke, var(--color-surface)),-0.0172em 0.08171em 1px var(--flavors-title-stroke, var(--color-surface)),-0.02674em 0.0791em 1px var(--flavors-title-stroke, var(--color-surface)),-0.03591em 0.07538em 1px var(--flavors-title-stroke, var(--color-surface)),-0.04457em 0.07061em 1px var(--flavors-title-stroke, var(--color-surface)),-0.05261em 0.06484em 1px var(--flavors-title-stroke, var(--color-surface)),-0.05991em 0.05816em 1px var(--flavors-title-stroke, var(--color-surface)),-0.06637em 0.05067em 1px var(--flavors-title-stroke, var(--color-surface)),-0.0719em 0.04246em 1px var(--flavors-title-stroke, var(--color-surface)),-0.07641em 0.03366em 1px var(--flavors-title-stroke, var(--color-surface)),-0.07986em 0.02439em 1px var(--flavors-title-stroke, var(--color-surface)),-0.08218em 0.01477em 1px var(--flavors-title-stroke, var(--color-surface)),-0.08335em 0.00495em 1px var(--flavors-title-stroke, var(--color-surface)),-0.08335em -0.00495em 1px var(--flavors-title-stroke, var(--color-surface)),-0.08218em -0.01477em 1px var(--flavors-title-stroke, var(--color-surface)),-0.07986em -0.02439em 1px var(--flavors-title-stroke, var(--color-surface)),-0.07641em -0.03366em 1px var(--flavors-title-stroke, var(--color-surface)),-0.0719em -0.04246em 1px var(--flavors-title-stroke, var(--color-surface)),-0.06637em -0.05067em 1px var(--flavors-title-stroke, var(--color-surface)),-0.05991em -0.05816em 1px var(--flavors-title-stroke, var(--color-surface)),-0.05261em -0.06484em 1px var(--flavors-title-stroke, var(--color-surface)),-0.04457em -0.07061em 1px var(--flavors-title-stroke, var(--color-surface)),-0.03591em -0.07538em 1px var(--flavors-title-stroke, var(--color-surface)),-0.02674em -0.0791em 1px var(--flavors-title-stroke, var(--color-surface)),-0.0172em -0.08171em 1px var(--flavors-title-stroke, var(--color-surface)),-0.00741em -0.08317em 1px var(--flavors-title-stroke, var(--color-surface)),0.00247em -0.08346em 1px var(--flavors-title-stroke, var(--color-surface)),0.01233em -0.08258em 1px var(--flavors-title-stroke, var(--color-surface)),0.02201em -0.08055em 1px var(--flavors-title-stroke, var(--color-surface)),0.03138em -0.07738em 1px var(--flavors-title-stroke, var(--color-surface)),0.04031em -0.07312em 1px var(--flavors-title-stroke, var(--color-surface)),0.04868em -0.06784em 1px var(--flavors-title-stroke, var(--color-surface)),0.05636em -0.06161em 1px var(--flavors-title-stroke, var(--color-surface)),0.06325em -0.05451em 1px var(--flavors-title-stroke, var(--color-surface)),0.06926em -0.04665em 1px var(--flavors-title-stroke, var(--color-surface)),0.07429em -0.03813em 1px var(--flavors-title-stroke, var(--color-surface)),0.07827em -0.02907em 1px var(--flavors-title-stroke, var(--color-surface)),0.08116em -0.01961em 1px var(--flavors-title-stroke, var(--color-surface)),0.08291em -0.00988em 1px var(--flavors-title-stroke, var(--color-surface));
	}
	.flavors-hero__lead {
		margin: 0;
		max-width: 52ch;
		font-family: var(--font-body);
		font-weight: var(--fw-medium);
		font-size: var(--fs-text);
		line-height: var(--lh-normal);
		color: var(--color-surface);
	}
	.flavors-hero__grid { display: none; grid-template-columns: 1fr 1fr; flex-shrink: 0; }
	@media (min-width: 62.5rem) {
		.flavors-hero__grid { display: grid; height: 100%; aspect-ratio: 1; grid-template-rows: 1fr 1fr; }
	}
	.flavors-hero__cell { position: relative; overflow: hidden; }
	.flavors-hero__cell--yellow { background: var(--color-brand-yellow); }
	.flavors-hero__cell--green  { background: var(--color-brand-green); }
	.flavors-hero__cell--blue   { background: var(--color-brand-blue); }
	.flavors-hero__cell--red    { background: var(--color-brand-red); }
	.flavors-hero__cell-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
	@media (prefers-reduced-motion: no-preference) {
		.flavors-hero__cell-img { opacity: 0; animation: flavors-cell-fade 0.7s var(--ease-out) forwards; }
		.flavors-hero__cell--yellow .flavors-hero__cell-img { animation-delay: 0.2s; }
		.flavors-hero__cell--red    .flavors-hero__cell-img { animation-delay: 0.7s; }
		.flavors-hero__cell--blue   .flavors-hero__cell-img { animation-delay: 1.2s; }
		.flavors-hero__cell--green  .flavors-hero__cell-img { animation-delay: 1.7s; }
	}
	@keyframes flavors-cell-fade { to { opacity: 1; } }

	.flavors { overflow: hidden; }
	.flavors__title {
		position: relative;
		justify-self: start;
		width: fit-content;
		margin: 0 0 clamp(2.5rem, 1rem + 4vw, 5rem);
		font-family: var(--font-display);
		font-weight: var(--fw-regular);
		line-height: var(--lh-display);
		color: var(--color-ink);
		text-transform: lowercase;
		font-size: var(--fs-h2);
	}
	.flavors__ozdobnik {
		position: absolute;
		top: clamp(-2.5rem, -0.95rem - 1.29vw, -1.25rem);
		right: clamp(-4.5rem, -1.7rem - 2.33vw, -2.25rem);
		width: clamp(3.25rem, 2.48rem + 3.3vw, 6.4375rem);
		height: clamp(2.75rem, 2.08rem + 2.85vw, 5.5rem);
		pointer-events: none;
		color: var(--color-brand-red);
	}
	.flavors__grid {
		display: grid;
		grid-template-columns: 1fr;
		gap: clamp(3rem, 1rem + 6vw, 7.5rem) clamp(2rem, 0.5rem + 4vw, 7.5rem);
		list-style: none;
		margin: 0;
		padding: 0;
	}
	.flavors__grid > li { list-style: none; }
	@media (min-width: 40rem) { .flavors__grid { grid-template-columns: 1fr 1fr; } }
	@media (min-width: 64rem) { .flavors__grid { grid-template-columns: repeat(3, 1fr); } }

	.flavor-card {
		display: flex;
		flex-direction: column;
		gap: clamp(1.5rem, 1rem + 1.5vw, 2.5rem);
		text-decoration: none;
		color: inherit;
		cursor: pointer;
	}
	.flavor-card__media { position: relative; aspect-ratio: 4 / 3; }
	.flavor-card__ingredients {
		position: absolute;
		z-index: 0;
		top: 2%;
		right: 2%;
		width: 60%;
		height: auto;
		transform: rotate(-20deg);
		transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
		pointer-events: none;
		user-select: none;
	}
	.flavor-card__pack {
		position: absolute;
		z-index: 1;
		left: 0;
		bottom: 0;
		height: 100%;
		width: auto;
		max-width: 70%;
		object-fit: contain;
		object-position: bottom left;
		transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
	}
	@media (prefers-reduced-motion: no-preference) and (hover: hover) {
		.flavor-card:hover .flavor-card__pack,
		.flavor-card:focus-visible .flavor-card__pack { transform: rotate(-6deg) translateX(-6%); }
		.flavor-card:hover .flavor-card__ingredients,
		.flavor-card:focus-visible .flavor-card__ingredients { transform: rotate(-20deg) scale(1.18); }
	}
	@media (max-width: 47.99rem) and (prefers-reduced-motion: no-preference) {
		.flavor-card.is-active .flavor-card__pack { transform: rotate(-6deg) translateX(-6%); }
		.flavor-card.is-active .flavor-card__ingredients { transform: rotate(-20deg) scale(1.18); }
	}
	.flavor-card:hover .link-arrow,
	.flavor-card:focus-visible .link-arrow { color: var(--color-brand-red); }
	.flavor-card:hover .link-arrow svg,
	.flavor-card:focus-visible .link-arrow svg { transform: translateX(0.5rem); }
	.flavor-card__body { display: flex; flex-direction: column; gap: clamp(1.5rem, 1rem + 1.5vw, 2.5rem); }
	.flavor-card__copy { display: flex; flex-direction: column; gap: 0.625rem; }
	.flavor-card__name {
		margin: 0;
		font-family: var(--font-body);
		font-weight: var(--fw-extrabold);
		font-size: var(--fs-h3);
		line-height: var(--lh-normal);
		color: var(--color-text);
	}
	.flavor-card__sizes {
		display: flex;
		gap: 1.25rem;
		margin: 0;
		padding: 0;
		list-style: none;
		font-family: var(--font-body);
		font-weight: var(--fw-medium);
		font-size: var(--fs-text);
		line-height: var(--lh-normal);
		color: var(--color-text);
	}
	.flavors__deco { top: clamp(12rem, 26vw, 30rem); }

	/* ===================== Product detail ===================== */
	.product-detail { background: var(--color-surface-alt); }
	.product-detail__layout { display: flex; flex-direction: column; }
	@media (min-width: 64rem) { .product-detail__layout { flex-direction: row; align-items: flex-start; } }
	.product-detail__gallery { flex: 1 1 50%; min-width: 0; width: 100%; }
	.product-detail__gallery .swiper-wrapper { flex-direction: column; }
	.product-detail__slide { width: 100%; height: auto; }
	.product-detail__image { display: block; width: 100%; aspect-ratio: 1; object-fit: cover; }
	@media (max-width: 63.99rem) { .product-detail__gallery .swiper-wrapper { flex-direction: row; } }
	.product-detail__info {
		flex: 1 1 50%;
		min-width: 0;
		display: flex;
		flex-direction: column;
		gap: clamp(2rem, 1rem + 3vw, 3.5rem);
		padding: clamp(2.5rem, 1rem + 6vw, 7.5rem) var(--container-pad);
	}
	@media (min-width: 64rem) {
		.product-detail__info {
			padding-inline: clamp(2.5rem, 5vw, 6.25rem) var(--container-pad);
			position: sticky;
			top: 2rem;
			align-self: flex-start;
		}
	}
	.product-detail__title {
		font-size: var(--fs-display-lg);
		margin: 0;
		font-family: var(--font-display);
		font-weight: var(--fw-regular);
		color: var(--color-surface);
		text-transform: lowercase;
		line-height: var(--lh-tight);
		text-shadow: 0.167em 0em 1px var(--color-brand-red-alt),0.16687em 0.00664em 1px var(--color-brand-red-alt),0.16647em 0.01327em 1px var(--color-brand-red-alt),0.16581em 0.01988em 1px var(--color-brand-red-alt),0.16489em 0.02645em 1px var(--color-brand-red-alt),0.16371em 0.03299em 1px var(--color-brand-red-alt),0.16227em 0.03947em 1px var(--color-brand-red-alt),0.16057em 0.04589em 1px var(--color-brand-red-alt),0.15862em 0.05224em 1px var(--color-brand-red-alt),0.15642em 0.0585em 1px var(--color-brand-red-alt),0.15397em 0.06467em 1px var(--color-brand-red-alt),0.15128em 0.07074em 1px var(--color-brand-red-alt),0.14834em 0.0767em 1px var(--color-brand-red-alt),0.14518em 0.08254em 1px var(--color-brand-red-alt),0.14178em 0.08825em 1px var(--color-brand-red-alt),0.13816em 0.09381em 1px var(--color-brand-red-alt),0.13432em 0.09923em 1px var(--color-brand-red-alt),0.13027em 0.10449em 1px var(--color-brand-red-alt),0.12601em 0.10959em 1px var(--color-brand-red-alt),0.12156em 0.11451em 1px var(--color-brand-red-alt),0.11691em 0.11925em 1px var(--color-brand-red-alt),0.11207em 0.12381em 1px var(--color-brand-red-alt),0.10706em 0.12817em 1px var(--color-brand-red-alt),0.10188em 0.13232em 1px var(--color-brand-red-alt),0.09654em 0.13627em 1px var(--color-brand-red-alt),0.09105em 0.14em 1px var(--color-brand-red-alt),0.08541em 0.14351em 1px var(--color-brand-red-alt),0.07964em 0.14679em 1px var(--color-brand-red-alt),0.07374em 0.14984em 1px var(--color-brand-red-alt),0.06772em 0.15265em 1px var(--color-brand-red-alt),0.0616em 0.15522em 1px var(--color-brand-red-alt),0.05538em 0.15755em 1px var(--color-brand-red-alt),0.04907em 0.15963em 1px var(--color-brand-red-alt),0.04269em 0.16145em 1px var(--color-brand-red-alt),0.03624em 0.16302em 1px var(--color-brand-red-alt),0.02973em 0.16433em 1px var(--color-brand-red-alt),0.02317em 0.16539em 1px var(--color-brand-red-alt),0.01658em 0.16618em 1px var(--color-brand-red-alt),0.00996em 0.1667em 1px var(--color-brand-red-alt),0.00332em 0.16697em 1px var(--color-brand-red-alt),-0.00332em 0.16697em 1px var(--color-brand-red-alt),-0.00996em 0.1667em 1px var(--color-brand-red-alt),-0.01658em 0.16618em 1px var(--color-brand-red-alt),-0.02317em 0.16539em 1px var(--color-brand-red-alt),-0.02973em 0.16433em 1px var(--color-brand-red-alt),-0.03624em 0.16302em 1px var(--color-brand-red-alt),-0.04269em 0.16145em 1px var(--color-brand-red-alt),-0.04907em 0.15963em 1px var(--color-brand-red-alt),-0.05538em 0.15755em 1px var(--color-brand-red-alt),-0.0616em 0.15522em 1px var(--color-brand-red-alt),-0.06772em 0.15265em 1px var(--color-brand-red-alt),-0.07374em 0.14984em 1px var(--color-brand-red-alt),-0.07964em 0.14679em 1px var(--color-brand-red-alt),-0.08541em 0.14351em 1px var(--color-brand-red-alt),-0.09105em 0.14em 1px var(--color-brand-red-alt),-0.09654em 0.13627em 1px var(--color-brand-red-alt),-0.10188em 0.13232em 1px var(--color-brand-red-alt),-0.10706em 0.12817em 1px var(--color-brand-red-alt),-0.11207em 0.12381em 1px var(--color-brand-red-alt),-0.11691em 0.11925em 1px var(--color-brand-red-alt),-0.12156em 0.11451em 1px var(--color-brand-red-alt),-0.12601em 0.10959em 1px var(--color-brand-red-alt),-0.13027em 0.10449em 1px var(--color-brand-red-alt),-0.13432em 0.09923em 1px var(--color-brand-red-alt),-0.13816em 0.09381em 1px var(--color-brand-red-alt),-0.14178em 0.08825em 1px var(--color-brand-red-alt),-0.14518em 0.08254em 1px var(--color-brand-red-alt),-0.14834em 0.0767em 1px var(--color-brand-red-alt),-0.15128em 0.07074em 1px var(--color-brand-red-alt),-0.15397em 0.06467em 1px var(--color-brand-red-alt),-0.15642em 0.0585em 1px var(--color-brand-red-alt),-0.15862em 0.05224em 1px var(--color-brand-red-alt),-0.16057em 0.04589em 1px var(--color-brand-red-alt),-0.16227em 0.03947em 1px var(--color-brand-red-alt),-0.16371em 0.03299em 1px var(--color-brand-red-alt),-0.16489em 0.02645em 1px var(--color-brand-red-alt),-0.16581em 0.01988em 1px var(--color-brand-red-alt),-0.16647em 0.01327em 1px var(--color-brand-red-alt),-0.16687em 0.00664em 1px var(--color-brand-red-alt),-0.167em 0em 1px var(--color-brand-red-alt),-0.16687em -0.00664em 1px var(--color-brand-red-alt),-0.16647em -0.01327em 1px var(--color-brand-red-alt),-0.16581em -0.01988em 1px var(--color-brand-red-alt),-0.16489em -0.02645em 1px var(--color-brand-red-alt),-0.16371em -0.03299em 1px var(--color-brand-red-alt),-0.16227em -0.03947em 1px var(--color-brand-red-alt),-0.16057em -0.04589em 1px var(--color-brand-red-alt),-0.15862em -0.05224em 1px var(--color-brand-red-alt),-0.15642em -0.0585em 1px var(--color-brand-red-alt),-0.15397em -0.06467em 1px var(--color-brand-red-alt),-0.15128em -0.07074em 1px var(--color-brand-red-alt),-0.14834em -0.0767em 1px var(--color-brand-red-alt),-0.14518em -0.08254em 1px var(--color-brand-red-alt),-0.14178em -0.08825em 1px var(--color-brand-red-alt),-0.13816em -0.09381em 1px var(--color-brand-red-alt),-0.13432em -0.09923em 1px var(--color-brand-red-alt),-0.13027em -0.10449em 1px var(--color-brand-red-alt),-0.12601em -0.10959em 1px var(--color-brand-red-alt),-0.12156em -0.11451em 1px var(--color-brand-red-alt),-0.11691em -0.11925em 1px var(--color-brand-red-alt),-0.11207em -0.12381em 1px var(--color-brand-red-alt),-0.10706em -0.12817em 1px var(--color-brand-red-alt),-0.10188em -0.13232em 1px var(--color-brand-red-alt),-0.09654em -0.13627em 1px var(--color-brand-red-alt),-0.09105em -0.14em 1px var(--color-brand-red-alt),-0.08541em -0.14351em 1px var(--color-brand-red-alt),-0.07964em -0.14679em 1px var(--color-brand-red-alt),-0.07374em -0.14984em 1px var(--color-brand-red-alt),-0.06772em -0.15265em 1px var(--color-brand-red-alt),-0.0616em -0.15522em 1px var(--color-brand-red-alt),-0.05538em -0.15755em 1px var(--color-brand-red-alt),-0.04907em -0.15963em 1px var(--color-brand-red-alt),-0.04269em -0.16145em 1px var(--color-brand-red-alt),-0.03624em -0.16302em 1px var(--color-brand-red-alt),-0.02973em -0.16433em 1px var(--color-brand-red-alt),-0.02317em -0.16539em 1px var(--color-brand-red-alt),-0.01658em -0.16618em 1px var(--color-brand-red-alt),-0.00996em -0.1667em 1px var(--color-brand-red-alt),-0.00332em -0.16697em 1px var(--color-brand-red-alt),0.00332em -0.16697em 1px var(--color-brand-red-alt),0.00996em -0.1667em 1px var(--color-brand-red-alt),0.01658em -0.16618em 1px var(--color-brand-red-alt),0.02317em -0.16539em 1px var(--color-brand-red-alt),0.02973em -0.16433em 1px var(--color-brand-red-alt),0.03624em -0.16302em 1px var(--color-brand-red-alt),0.04269em -0.16145em 1px var(--color-brand-red-alt),0.04907em -0.15963em 1px var(--color-brand-red-alt),0.05538em -0.15755em 1px var(--color-brand-red-alt),0.0616em -0.15522em 1px var(--color-brand-red-alt),0.06772em -0.15265em 1px var(--color-brand-red-alt),0.07374em -0.14984em 1px var(--color-brand-red-alt),0.07964em -0.14679em 1px var(--color-brand-red-alt),0.08541em -0.14351em 1px var(--color-brand-red-alt),0.09105em -0.14em 1px var(--color-brand-red-alt),0.09654em -0.13627em 1px var(--color-brand-red-alt),0.10188em -0.13232em 1px var(--color-brand-red-alt),0.10706em -0.12817em 1px var(--color-brand-red-alt),0.11207em -0.12381em 1px var(--color-brand-red-alt),0.11691em -0.11925em 1px var(--color-brand-red-alt),0.12156em -0.11451em 1px var(--color-brand-red-alt),0.12601em -0.10959em 1px var(--color-brand-red-alt),0.13027em -0.10449em 1px var(--color-brand-red-alt),0.13432em -0.09923em 1px var(--color-brand-red-alt),0.13816em -0.09381em 1px var(--color-brand-red-alt),0.14178em -0.08825em 1px var(--color-brand-red-alt),0.14518em -0.08254em 1px var(--color-brand-red-alt),0.14834em -0.0767em 1px var(--color-brand-red-alt),0.15128em -0.07074em 1px var(--color-brand-red-alt),0.15397em -0.06467em 1px var(--color-brand-red-alt),0.15642em -0.0585em 1px var(--color-brand-red-alt),0.15862em -0.05224em 1px var(--color-brand-red-alt),0.16057em -0.04589em 1px var(--color-brand-red-alt),0.16227em -0.03947em 1px var(--color-brand-red-alt),0.16371em -0.03299em 1px var(--color-brand-red-alt),0.16489em -0.02645em 1px var(--color-brand-red-alt),0.16581em -0.01988em 1px var(--color-brand-red-alt),0.16647em -0.01327em 1px var(--color-brand-red-alt),0.16687em -0.00664em 1px var(--color-brand-red-alt),0.0835em 0em 1px var(--color-brand-red-alt),0.08324em 0.00663em 1px var(--color-brand-red-alt),0.08245em 0.01323em 1px var(--color-brand-red-alt),0.08113em 0.01973em 1px var(--color-brand-red-alt),0.07931em 0.02612em 1px var(--color-brand-red-alt),0.07698em 0.03234em 1px var(--color-brand-red-alt),0.07417em 0.03835em 1px var(--color-brand-red-alt),0.07089em 0.04412em 1px var(--color-brand-red-alt),0.06716em 0.04962em 1px var(--color-brand-red-alt),0.06301em 0.05479em 1px var(--color-brand-red-alt),0.05845em 0.05963em 1px var(--color-brand-red-alt),0.05353em 0.06408em 1px var(--color-brand-red-alt),0.04827em 0.06813em 1px var(--color-brand-red-alt),0.0427em 0.07175em 1px var(--color-brand-red-alt),0.03687em 0.07492em 1px var(--color-brand-red-alt),0.0308em 0.07761em 1px var(--color-brand-red-alt),0.02454em 0.07981em 1px var(--color-brand-red-alt),0.01812em 0.08151em 1px var(--color-brand-red-alt),0.01158em 0.08269em 1px var(--color-brand-red-alt),0.00498em 0.08335em 1px var(--color-brand-red-alt),-0.00166em 0.08348em 1px var(--color-brand-red-alt),-0.00829em 0.08309em 1px var(--color-brand-red-alt),-0.01486em 0.08217em 1px var(--color-brand-red-alt),-0.02134em 0.08073em 1px var(--color-brand-red-alt),-0.02769em 0.07878em 1px var(--color-brand-red-alt),-0.03386em 0.07633em 1px var(--color-brand-red-alt),-0.03982em 0.07339em 1px var(--color-brand-red-alt),-0.04552em 0.07em 1px var(--color-brand-red-alt),-0.05094em 0.06616em 1px var(--color-brand-red-alt),-0.05604em 0.0619em 1px var(--color-brand-red-alt),-0.06078em 0.05726em 1px var(--color-brand-red-alt),-0.06513em 0.05225em 1px var(--color-brand-red-alt),-0.06908em 0.04691em 1px var(--color-brand-red-alt),-0.07259em 0.04127em 1px var(--color-brand-red-alt),-0.07564em 0.03537em 1px var(--color-brand-red-alt),-0.07821em 0.02925em 1px var(--color-brand-red-alt),-0.08029em 0.02294em 1px var(--color-brand-red-alt),-0.08185em 0.01649em 1px var(--color-brand-red-alt),-0.08291em 0.00994em 1px var(--color-brand-red-alt),-0.08343em 0.00332em 1px var(--color-brand-red-alt),-0.08343em -0.00332em 1px var(--color-brand-red-alt),-0.08291em -0.00994em 1px var(--color-brand-red-alt),-0.08185em -0.01649em 1px var(--color-brand-red-alt),-0.08029em -0.02294em 1px var(--color-brand-red-alt),-0.07821em -0.02925em 1px var(--color-brand-red-alt),-0.07564em -0.03537em 1px var(--color-brand-red-alt),-0.07259em -0.04127em 1px var(--color-brand-red-alt),-0.06908em -0.04691em 1px var(--color-brand-red-alt),-0.06513em -0.05225em 1px var(--color-brand-red-alt),-0.06078em -0.05726em 1px var(--color-brand-red-alt),-0.05604em -0.0619em 1px var(--color-brand-red-alt),-0.05094em -0.06616em 1px var(--color-brand-red-alt),-0.04552em -0.07em 1px var(--color-brand-red-alt),-0.03982em -0.07339em 1px var(--color-brand-red-alt),-0.03386em -0.07633em 1px var(--color-brand-red-alt),-0.02769em -0.07878em 1px var(--color-brand-red-alt),-0.02134em -0.08073em 1px var(--color-brand-red-alt),-0.01486em -0.08217em 1px var(--color-brand-red-alt),-0.00829em -0.08309em 1px var(--color-brand-red-alt),-0.00166em -0.08348em 1px var(--color-brand-red-alt),0.00498em -0.08335em 1px var(--color-brand-red-alt),0.01158em -0.08269em 1px var(--color-brand-red-alt),0.01812em -0.08151em 1px var(--color-brand-red-alt),0.02454em -0.07981em 1px var(--color-brand-red-alt),0.0308em -0.07761em 1px var(--color-brand-red-alt),0.03687em -0.07492em 1px var(--color-brand-red-alt),0.0427em -0.07175em 1px var(--color-brand-red-alt),0.04827em -0.06813em 1px var(--color-brand-red-alt),0.05353em -0.06408em 1px var(--color-brand-red-alt),0.05845em -0.05963em 1px var(--color-brand-red-alt),0.06301em -0.05479em 1px var(--color-brand-red-alt),0.06716em -0.04962em 1px var(--color-brand-red-alt),0.07089em -0.04412em 1px var(--color-brand-red-alt),0.07417em -0.03835em 1px var(--color-brand-red-alt),0.07698em -0.03234em 1px var(--color-brand-red-alt),0.07931em -0.02612em 1px var(--color-brand-red-alt),0.08113em -0.01973em 1px var(--color-brand-red-alt),0.08245em -0.01323em 1px var(--color-brand-red-alt),0.08324em -0.00663em 1px var(--color-brand-red-alt);
	}
	.product-detail__title-small { display: block; font-size: var(--fs-display-sm); }
	.product-detail__title-big   { display: block; font-size: var(--fs-display-lg); }
	.product-detail__meta {
		margin: 0;
		font-family: var(--font-body);
		font-weight: var(--fw-medium);
		font-size: var(--fs-body);
		color: var(--color-text);
	}
	.product-detail__desc {
		margin: 0;
		max-width: none;
		font-family: var(--font-body);
		font-weight: var(--fw-medium);
		font-size: var(--fs-text);
		line-height: var(--lh-normal);
		color: var(--color-ink);
	}
	.product-detail__intro { display: flex; flex-direction: column; gap: 1.25rem; }
	.product-detail__badges {
		display: grid;
		grid-template-columns: repeat(2, auto);
		justify-content: start;
		gap: 1.25rem 2.5rem;
	}
	@media (max-width: 47.99rem) { .product-detail__badges { grid-template-columns: 1fr; } }
	.product-badge { display: flex; align-items: center; gap: 1.25rem; min-width: 0; }
	@media (min-width: 64rem) { .product-badge { gap: clamp(0.875rem, 1.5vw, 1.25rem); } }
	.product-badge__icon {
		flex-shrink: 0;
		width: 5rem;
		height: 5rem;
		border-radius: var(--radius-pill);
		background: var(--color-surface);
		display: grid;
		place-items: center;
	}
	@media (min-width: 64rem) {
		.product-badge__icon { width: clamp(2.75rem, 4.2vw, 5rem); height: clamp(2.75rem, 4.2vw, 5rem); }
	}
	.product-badge__icon img { width: 56%; height: 50%; object-fit: contain; }
	.product-badge__label {
		font-family: var(--font-body);
		font-weight: var(--fw-extrabold);
		font-size: var(--fs-h3);
		line-height: var(--lh-tight);
		color: var(--color-brand-blue);
		white-space: nowrap;
	}
	@media (min-width: 64rem) { .product-badge__label { font-size: clamp(1.25rem, 1.9vw, 2.25rem); } }
	.product-detail__flavors-label {
		margin: 0 0 1.25rem;
		font-family: var(--font-body);
		font-weight: var(--fw-medium);
		font-size: var(--fs-body);
		color: var(--color-text);
	}
	.product-detail__flavors-grid { display: flex; flex-wrap: wrap; gap: 0.625rem; }
	.mini-flavor {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: space-between;
		gap: 0.5rem;
		width: 10rem;
		padding: 0.5rem;
		background: var(--color-surface);
		text-decoration: none;
		color: inherit;
		transition: box-shadow var(--duration-fast) var(--ease-out);
	}
	.mini-flavor:hover,
	.mini-flavor:focus-visible { box-shadow: var(--shadow-md); }
	.mini-flavor__media {
		width: 100%;
		aspect-ratio: 1 / 1;
		padding: 0.5rem;
		min-height: 0;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.mini-flavor__media img { height: 100%; width: 100%; object-fit: contain; }
	.mini-flavor__name {
		margin: 0;
		min-height: 2lh;
		display: flex;
		align-items: flex-start;
		justify-content: center;
		text-align: center;
		font-family: var(--font-body);
		font-weight: var(--fw-medium);
		font-size: var(--fs-body);
		line-height: var(--lh-tight);
		color: var(--color-text);
	}
	.flavors__deco--wide { top: clamp(2rem, 4vw, 7rem); width: clamp(12rem, 26vw, 33.0625rem); height: auto; }
	#other-products .product-carousel { margin-top: 1.25rem; }
}

/* Paginacja galerii — UNLAYERED (musi pobić swiper/css/pagination, też unlayered). */
.product-detail__gallery .swiper-pagination { display: none; }
@media (max-width: 63.99rem) {
	.product-detail__gallery .swiper-pagination {
		display: flex;
		justify-content: center;
		gap: 0.375rem;
		bottom: clamp(1rem, 0.5rem + 1.5vw, 1.5rem);
	}
	.product-detail__gallery .swiper-pagination-bullet {
		width: clamp(1.875rem, 1.5rem + 1.875vw, 3.125rem);
		height: 0.25rem;
		border-radius: var(--radius-sm);
		background: var(--color-surface);
		opacity: 0.7;
		margin: 0;
		transition: opacity var(--duration-fast) var(--ease-out);
	}
	.product-detail__gallery .swiper-pagination-bullet-active {
		background: var(--color-brand-red);
		opacity: 1;
	}
}

/* ── Fix nagłówków (UNLAYERED) ──────────────────────────────────────────────
   theme.json emituje PUSTE --wp--preset--font-size--h1/h2, więc jego reguły
   elementów h1/h2 (unlayered) z niepoprawnym var() zwijają rozmiar naszych
   warstwowych nagłówków katalogu do dziedziczonych 16px. Przywracamy skalę
   regułą UNLAYERED z wyższą specyficznością (element+klasa > bare element). */
h1.categories-hero__title,
h1.product-detail__title { font-size: var(--fs-display-lg); }
h1.flavors-hero__title   { font-size: var(--fs-h2); }
h2.flavors__title        { font-size: var(--fs-h2); }
h2.accordion__title      { font-size: var(--fs-h3); }
.accordion--compact h2.accordion__title { font-size: var(--fs-h4); }
h3.category-card__heading { font-size: clamp(3rem, 1.5rem + 6vw, 6.25rem); }

/* ── Fix obrazów w edytorze (UNLAYERED) ─────────────────────────────────────
   WP core w canvasie ma regułę .editor-styles-wrapper img { height: auto }
   (UNLAYERED), która bije nasze @layer height:100% dla obrazów object-fit:cover
   -> zdjęcie karty jest niższe niż kwadratowy kontener (wygląda jak ucięte) i
   packshoty hero gubią wysokość. Wymuszamy unlayered z wyższą specyficznością.
   Na froncie tej reguły core nie ma, więc nic nie zmienia. */
a.category-card__media img { width: 100%; height: 100%; object-fit: cover; }
.categories-hero img.categories-hero__pack--1 { width: 13.46vw; height: 21.10vw; }
.categories-hero img.categories-hero__pack--2 { width: 15.12vw; height: 21.86vw; }
.categories-hero img.categories-hero__pack--3 { width: 16.05vw; height: 23.23vw; }
.categories-hero img.categories-hero__pack--4 { width: 16.72vw; height: 18.13vw; }
.categories-hero img.categories-hero__pack--5 { width: 19.47vw; height: 19.47vw; }
.categories-hero img.categories-hero__pack--6 { width: 23.21vw; height: 19.24vw; }