/*
 * DESIGN BRIEF (seed 4596040866, manifest KatalogUI: K-0092-K + K-0052-T + K-0081-K)
 * Struktura: pasek nawigacji przyklejony do dołu, pełna szerokość, jedna linia, segmenty rozdzielone linią.
 * Typografia: jedno zdanie szeryfem (Fraunces) na pełnym kadrze; przewinięcie wymienia kadr i zdanie.
 * Kolor: noc #170c26 + smoczy owoc #ff4696 jako jedyny akcent (ciemny tekst na różu), masło #fff275 tylko na hover.
 * Ruch: przenikanie kadrów sterowane przewijaniem, kaskadowe wejście wpisów; reduced-motion = bez ruchu.
 */

:root {
	--gf-bar-h: 3.5rem;
	--gf-line: rgba(247, 242, 236, 0.16);
	--gf-ease: cubic-bezier(0.22, 1, 0.36, 1);
}

html { scroll-padding-bottom: var(--gf-bar-h); }
body {
	padding-bottom: var(--gf-bar-h);
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
}
:where(a, button, input, select, textarea, summary):focus-visible {
	outline: 2px solid var(--wp--preset--color--smoczy);
	outline-offset: 3px;
}
::selection { background: var(--wp--preset--color--smoczy); color: #12081e; }

/* ---------- Nagłówek: znak słowny na środku, bez pudełka ---------- */
.gf-header {
	position: relative;
	z-index: 20;
	padding-block: 1.25rem;
}
.gf-main--front ~ .gf-header, body.home .gf-header {
	position: absolute;
	inset: 0 0 auto 0;
}
.gf-wordmark, .gf-footer__name {
	margin: 0;
	font-family: var(--wp--preset--font-family--fraunces);
	font-weight: 600;
	font-size: 1.35rem;
	letter-spacing: -0.01em;
}
.gf-wordmark a, .gf-footer__name a { text-decoration: none; }

/* ---------- Pasek nawigacji przy dolnej krawędzi ---------- */
.gf-bar {
	position: fixed;
	inset: auto 0 0 0;
	z-index: 50;
	height: var(--gf-bar-h);
	gap: 0 !important;
	padding: 0 !important;
	background: color-mix(in oklab, var(--wp--preset--color--noc) 88%, transparent);
	backdrop-filter: blur(14px);
	border-top: 1px solid var(--gf-line);
}
.gf-bar__nav { flex: 1; height: 100%; }
.gf-bar__nav .wp-block-navigation__container { gap: 0 !important; height: 100%; width: 100%; }
.gf-bar .wp-block-navigation-item {
	flex: 1;
	height: 100%;
	border-right: 1px solid var(--gf-line);
}
.gf-bar .wp-block-navigation-item__content {
	display: flex !important;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	font-size: 0.875rem;
	font-weight: 500;
	letter-spacing: 0.01em;
	text-decoration: none;
	transition: background-color 0.2s var(--gf-ease), color 0.2s var(--gf-ease);
}
.gf-bar .wp-block-navigation-item__content:hover { background: var(--wp--preset--color--noc-2); color: var(--wp--preset--color--papier); }
.gf-bar .current-menu-item > .wp-block-navigation-item__content,
.gf-bar .wp-block-navigation-item__content[aria-current="page"] {
	box-shadow: inset 0 2px 0 var(--wp--preset--color--smoczy);
}
.gf-bar__cart { height: 100%; display: flex; align-items: center; padding-inline: 1rem; }
.gf-bar__cart .wc-block-mini-cart__button { color: var(--wp--preset--color--papier); }
.gf-bar__cart .wc-block-mini-cart__badge { background: var(--wp--preset--color--smoczy); color: #12081e; border-color: transparent; }
@media (max-width: 480px) {
	.gf-bar .wp-block-navigation-item__content { font-size: 0.78rem; }
	.gf-bar__cart { padding-inline: 0.6rem; }
}

/* ---------- Kadry ze zdaniem (strona główna) ---------- */
.gf-main--front { padding: 0 !important; }
.gf-main--front > .entry-content > *:first-child { margin-top: 0; }
.is-style-gf-story { margin-block: 0 !important; max-width: none !important; }
.gf-frame { min-height: 100svh; }
.gf-frame .wp-block-cover__image-background { transform: scale(1.04); }
.gf-frame__label {
	margin: 0 0 1rem;
	font-size: var(--wp--preset--font-size--s);
	font-weight: 600;
	color: var(--wp--preset--color--smoczy);
}
.gf-frame__line {
	margin: 0 auto;
	max-width: 18ch;
	font-family: var(--wp--preset--font-family--fraunces);
	font-weight: 400;
	font-size: clamp(2rem, 6.2vw, 5rem);
	line-height: 1.05;
	letter-spacing: -0.02em;
	text-wrap: balance;
}
.gf-frame .wp-block-buttons { margin-top: 2rem; }

/* Tryb sceny (JS dodaje .is-staged): kadry nałożone, przewijanie wymienia aktywny kadr. */
.is-style-gf-story.is-staged { position: relative; }
.is-style-gf-story.is-staged .gf-stage {
	position: sticky;
	top: 0;
	height: 100svh;
	overflow: hidden;
}
.is-style-gf-story.is-staged .gf-frame {
	position: absolute !important;
	inset: 0;
	margin: 0 !important;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.9s var(--gf-ease), visibility 0s linear 0.9s;
}
.is-style-gf-story.is-staged .gf-frame .wp-block-cover__image-background {
	transition: transform 6s linear;
}
.is-style-gf-story.is-staged .gf-frame .gf-frame__line,
.is-style-gf-story.is-staged .gf-frame .gf-frame__label,
.is-style-gf-story.is-staged .gf-frame .wp-block-buttons {
	opacity: 0;
	transform: translateY(1.2rem);
	transition: opacity 0.7s var(--gf-ease), transform 0.7s var(--gf-ease);
}
.is-style-gf-story.is-staged .gf-frame.is-active {
	opacity: 1;
	visibility: visible;
	transition: opacity 0.9s var(--gf-ease), visibility 0s;
}
.is-style-gf-story.is-staged .gf-frame.is-active .wp-block-cover__image-background { transform: scale(1); }
.is-style-gf-story.is-staged .gf-frame.is-active .gf-frame__label { opacity: 1; transform: none; transition-delay: 0.15s; }
.is-style-gf-story.is-staged .gf-frame.is-active .gf-frame__line { opacity: 1; transform: none; transition-delay: 0.25s; }
.is-style-gf-story.is-staged .gf-frame.is-active .wp-block-buttons { opacity: 1; transform: none; transition-delay: 0.45s; }

.gf-progress {
	position: absolute;
	right: clamp(1rem, 3vw, 2.5rem);
	top: 50%;
	z-index: 5;
	display: grid;
	gap: 0.6rem;
	transform: translateY(-50%);
	margin: 0;
	padding: 0;
	list-style: none;
}
.gf-progress button {
	display: block;
	width: 3px;
	height: 2.25rem;
	padding: 0;
	border: 0;
	background: var(--gf-line);
	cursor: pointer;
	transition: background-color 0.3s var(--gf-ease), transform 0.3s var(--gf-ease);
}
.gf-progress button::after { content: ""; position: absolute; inset: -0.5rem -0.9rem; }
.gf-progress li { position: relative; }
.gf-progress button[aria-current="true"] { background: var(--wp--preset--color--smoczy); transform: scaleX(1.6); }

/* ---------- Sekcje ---------- */
.gf-main { padding-top: var(--wp--preset--spacing--4); padding-bottom: var(--wp--preset--spacing--5); }
.gf-main--single { padding-top: 0; }
.gf-section { padding-block: var(--wp--preset--spacing--6) 0; max-width: var(--wp--style--global--wide-size); margin-inline: auto; }
.gf-section__title, .gf-page-title {
	font-size: var(--wp--preset--font-size--xxl) !important;
	margin-block: 0 var(--wp--preset--spacing--4) !important;
}
.gf-section__lead { color: var(--wp--preset--color--mgla); margin-top: calc(-1 * var(--wp--preset--spacing--3)); }
.gf-more a {
	font-weight: 600;
	text-decoration: none;
	background: linear-gradient(currentColor, currentColor) 0 100% / 100% 1px no-repeat;
	padding-bottom: 2px;
	transition: background-size 0.35s var(--gf-ease), color 0.2s;
}
.gf-more a:hover { background-size: 0% 1px; background-position: 100% 100%; }
.gf-more a::after { content: " →"; }

/* ---------- Wpisy: układ redakcyjny, pierwszy wpis duży ---------- */
.gf-posts {
	display: grid !important;
	grid-template-columns: repeat(12, 1fr);
	gap: var(--wp--preset--spacing--4) var(--wp--preset--spacing--3);
	list-style: none;
	padding: 0;
}
.gf-posts > li { grid-column: span 4; display: flex; flex-direction: column; gap: 0.9rem; margin: 0; }
.gf-posts > li:first-child {
	grid-column: 1 / -1;
	display: grid;
	grid-template-columns: 7fr 5fr;
	align-items: end;
	gap: var(--wp--preset--spacing--4);
	padding-bottom: var(--wp--preset--spacing--4);
	border-bottom: 1px solid var(--gf-line);
}
.gf-posts > li:first-child .gf-posts__img img { aspect-ratio: 4 / 3 !important; }
.gf-posts > li:first-child .gf-posts__title { font-size: var(--wp--preset--font-size--xl); }
.gf-posts > li:nth-child(2), .gf-posts > li:nth-child(3) { grid-column: span 6; }
.gf-posts__img { margin: 0; overflow: hidden; }
.gf-posts__img img { transition: transform 0.8s var(--gf-ease); }
.gf-posts > li:hover .gf-posts__img img { transform: scale(1.04); }
.gf-posts__body > * { margin-block: 0 0.6rem; }
.gf-posts__cat a { color: var(--wp--preset--color--smoczy); text-decoration: none; font-weight: 600; }
.gf-posts__title { font-size: var(--wp--preset--font-size--l); }
.gf-posts__title a { text-decoration: none; }
.gf-posts__title a:hover { color: var(--wp--preset--color--smoczy); }
.gf-posts__excerpt { color: var(--wp--preset--color--mgla); }
.gf-posts__excerpt .wp-block-post-excerpt__more-link { display: none; }
@media (max-width: 900px) {
	.gf-posts > li, .gf-posts > li:nth-child(2), .gf-posts > li:nth-child(3) { grid-column: span 6; }
	.gf-posts > li:first-child { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
	.gf-posts > li, .gf-posts > li:nth-child(2), .gf-posts > li:nth-child(3) { grid-column: 1 / -1; }
}

/* Kaskadowe wejście przy przewijaniu (tylko gdy przeglądarka umie i użytkownik nie wyłączył ruchu). */
@media (prefers-reduced-motion: no-preference) {
	@supports (animation-timeline: view()) {
		.gf-posts > li, .gf-shelf ul.products > li, .gf-about {
			animation: gf-rise linear both;
			animation-timeline: view();
			animation-range: entry 0% entry 40%;
		}
	}
}
@keyframes gf-rise { from { opacity: 0; transform: translateY(2.5rem); } to { opacity: 1; transform: none; } }

/* ---------- Półka produktów: poziomy pas z przeciąganiem ---------- */
.gf-shelf .woocommerce { width: 100%; }
.gf-shelf ul.products {
	display: grid !important;
	grid-auto-flow: column;
	grid-auto-columns: minmax(15rem, 22rem);
	gap: var(--wp--preset--spacing--3);
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	overscroll-behavior-x: contain;
	padding: 0 0 1.25rem !important;
	margin: 0 !important;
	scrollbar-width: thin;
	scrollbar-color: var(--wp--preset--color--smoczy) transparent;
	cursor: grab;
}
.gf-shelf ul.products.is-dragging { cursor: grabbing; scroll-snap-type: none; }
.gf-shelf ul.products::before, .gf-shelf ul.products::after { display: none !important; }
.gf-shelf ul.products li.product { width: auto !important; margin: 0 !important; float: none !important; scroll-snap-align: start; }

/* ---------- WooCommerce: wspólne ---------- */
.woocommerce ul.products li.product,
.wc-block-grid__product, .wc-block-product {
	text-align: left;
}
.woocommerce ul.products li.product a img { margin-bottom: 0.9rem; background: var(--wp--preset--color--noc-2); }
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.wc-block-components-product-name {
	font-family: var(--wp--preset--font-family--fraunces);
	font-size: 1.15rem !important;
	font-weight: 500;
	padding: 0 !important;
	color: var(--wp--preset--color--papier);
}
.woocommerce ul.products li.product .price, .woocommerce div.product p.price, .woocommerce div.product span.price,
.wc-block-components-product-price { color: var(--wp--preset--color--papier) !important; font-weight: 600; }
.woocommerce ul.products li.product .price del, .woocommerce div.product p.price del { color: var(--wp--preset--color--mgla); opacity: 0.8; }
.woocommerce ul.products li.product .price ins, .woocommerce div.product p.price ins { text-decoration: none; color: var(--wp--preset--color--smoczy); }
.woocommerce span.onsale, .wc-block-components-product-sale-badge {
	min-height: 0; min-width: 0; line-height: 1;
	padding: 0.45rem 0.6rem !important;
	border-radius: 0 !important;
	background: var(--wp--preset--color--maslo) !important;
	color: #12081e !important;
	font-weight: 700;
	border: 0 !important;
}
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .woocommerce #respond input#submit,
.wc-block-components-button:not(.is-link), .wp-block-button__link {
	border-radius: 0 !important;
	background: var(--wp--preset--color--smoczy) !important;
	color: #12081e !important;
	font-weight: 600 !important;
	transition: background-color 0.2s var(--gf-ease), transform 0.15s var(--gf-ease);
}
.woocommerce a.button:hover, .woocommerce button.button:hover, .wc-block-components-button:not(.is-link):hover, .wp-block-button__link:hover {
	background: var(--wp--preset--color--maslo) !important;
}
.woocommerce a.button:active, .woocommerce button.button:active, .wc-block-components-button:active, .wp-block-button__link:active { transform: scale(0.97); }
.woocommerce .quantity .qty, .wc-block-components-text-input input, .wc-block-components-select select,
.wc-block-components-textarea, .wp-block-search__input, input[type="text"], input[type="email"], input[type="tel"], select, textarea {
	border-radius: 0 !important;
	background: var(--wp--preset--color--noc-2) !important;
	color: var(--wp--preset--color--papier) !important;
	border: 1px solid var(--gf-line) !important;
}
.wc-block-components-text-input label, .wc-block-components-select label { color: var(--wp--preset--color--mgla) !important; }
.woocommerce-message, .woocommerce-info, .woocommerce-error, .wc-block-components-notice-banner {
	background: var(--wp--preset--color--noc-2) !important;
	color: var(--wp--preset--color--papier) !important;
	border-top-color: var(--wp--preset--color--smoczy) !important;
	border-radius: 0 !important;
}
.wc-block-components-notice-banner { border: 1px solid var(--gf-line) !important; }
.woocommerce div.product .woocommerce-tabs ul.tabs li { border-radius: 0; background: transparent; border-color: var(--gf-line); }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active { background: var(--wp--preset--color--noc-2); }
.woocommerce div.product .woocommerce-tabs ul.tabs li a { color: var(--wp--preset--color--papier); }
.wc-block-breadcrumbs, .woocommerce-breadcrumb { color: var(--wp--preset--color--mgla) !important; font-size: var(--wp--preset--font-size--s); }
.wc-block-mini-cart__drawer .components-modal__content,
.wc-block-mini-cart__drawer .wc-block-components-drawer__content { background: var(--wp--preset--color--noc); color: var(--wp--preset--color--papier); }
.wc-block-components-sidebar-layout .wc-block-components-main, .wc-block-components-sidebar { color: var(--wp--preset--color--papier); }
.wc-block-components-panel, .wc-block-components-totals-wrapper { border-color: var(--gf-line) !important; }
.wc-block-components-radio-control__option, .wc-block-components-radio-control-accordion-option { border-radius: 0 !important; }
.wp-block-woocommerce-product-collection .wc-block-product-template { gap: var(--wp--preset--spacing--3); }

/* ---------- Wpis ---------- */
.gf-single-hero { margin-top: calc(-1 * (2.5rem + 1.35rem * 1.6)); }
.gf-single-hero .wp-block-post-title { font-size: var(--wp--preset--font-size--xxl); max-width: 20ch; margin-block: 0.4rem; text-wrap: balance; }
.gf-single-hero .wp-block-post-terms a { color: var(--wp--preset--color--smoczy); text-decoration: none; font-weight: 600; }
.gf-article { padding-block: var(--wp--preset--spacing--5); font-size: 1.125rem; }
.gf-article .wp-block-post-content > p:first-of-type::first-letter {
	float: left;
	font-family: var(--wp--preset--font-family--fraunces);
	font-size: 4.2em;
	line-height: 0.85;
	padding: 0.08em 0.1em 0 0;
	color: var(--wp--preset--color--smoczy);
}
.gf-article h2 { margin-top: 2.5rem; }
.wp-block-post-navigation-link { margin-block: 0.75rem; }

/* ---------- O mnie (split) ---------- */
.gf-about { margin-top: var(--wp--preset--spacing--6) !important; background: var(--wp--preset--color--noc-2); min-height: 70vh; }
.gf-about .wp-block-media-text__content { padding: var(--wp--preset--spacing--5) !important; }

/* ---------- Stopka ---------- */
.gf-footer { border-top: 1px solid var(--gf-line); margin-top: var(--wp--preset--spacing--5); }
.gf-footer__links a { margin-left: 1.25rem; color: var(--wp--preset--color--mgla); }
.gf-footer__links a:first-child { margin-left: 0; }

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation: none !important; transition-duration: 0.01ms !important; }
}

/* ---------- Poprawki po pierwszych zrzutach ---------- */
.wc-block-product-template.wc-block-product-template__responsive {
	display: grid !important;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 15.5rem), 1fr)) !important;
	gap: var(--wp--preset--spacing--4) var(--wp--preset--spacing--3) !important;
}
.wc-block-product { margin: 0 !important; width: auto !important; }
.wc-block-product .wc-block-components-product-image img { aspect-ratio: 1; object-fit: cover; background: var(--wp--preset--color--noc-2); }
@media (max-width: 600px) {
	.gf-progress { right: 0.4rem; gap: 0.45rem; }
	.gf-progress button { height: 1.6rem; }
	.gf-frame .wp-block-cover__inner-container { padding-inline: 1.5rem; }
}

/* ---------- Dostępność i urządzenia dotykowe ---------- */
:root { color-scheme: dark; }
html { -webkit-tap-highlight-color: transparent; }
a, button, .wp-block-navigation-item__content { touch-action: manipulation; }
.gf-skip {
	position: absolute; left: 1rem; top: -4rem; z-index: 100;
	padding: 0.75rem 1rem; background: var(--wp--preset--color--smoczy); color: #12081e; font-weight: 600;
	transition: top 0.2s var(--gf-ease);
}
.gf-skip:focus { top: 1rem; color: #12081e; }
.gf-bar { height: calc(var(--gf-bar-h) + env(safe-area-inset-bottom)); padding-bottom: env(safe-area-inset-bottom) !important; }
body { padding-bottom: calc(var(--gf-bar-h) + env(safe-area-inset-bottom)); }
.gf-shelf ul.products.is-dragging { user-select: none; }
.gf-frame h1.gf-frame__line { color: inherit; }
.gf-frame__line, .gf-posts__title, .gf-page-title { overflow-wrap: break-word; }
select { background-color: var(--wp--preset--color--noc-2); color: var(--wp--preset--color--papier); }

/* ---------- Kadry: pełna szerokość ekranu, bez odstępu u góry ---------- */
html, body { overflow-x: clip; }
.gf-main--front .wp-block-post-content { margin-block-start: 0 !important; }
.gf-main--front .wp-block-post-content > .is-style-gf-story {
	width: 100vw;
	max-width: 100vw !important;
	margin-inline: calc(50% - 50vw) !important;
	margin-block-start: 0 !important;
}
.gf-frame__label {
	width: fit-content;
	margin-inline: auto !important;
	padding: 0.35rem 0.7rem;
	background: #12081e;
	letter-spacing: 0.02em;
}
.gf-frame__line { text-shadow: 0 2px 30px rgba(18, 8, 30, 0.55); }
@media (max-width: 600px) {
	.wc-block-product-template.wc-block-product-template__responsive { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 1.5rem 0.75rem !important; }
	.wc-block-product .wp-block-button__link, .wc-block-product .wc-block-components-product-button__button { padding: 0.6rem 0.5rem !important; font-size: 0.8rem !important; }
	.wc-block-components-product-name { font-size: 1rem !important; }
}
.wc-block-components-order-summary-item__quantity { background: var(--wp--preset--color--smoczy) !important; color: #12081e !important; border-color: var(--wp--preset--color--noc) !important; box-shadow: none !important; }
body.admin-bar.home .gf-header { top: var(--wp-admin--admin-bar--height, 32px); }

/* ---------- Znak graficzny obok nazwy ---------- */
.gf-brand { gap: 0.6rem !important; }
.gf-brand__mark { margin: 0; line-height: 0; }
.gf-brand__mark img { display: block; height: auto; }
@media (prefers-reduced-motion: no-preference) {
	.gf-brand__mark a:hover img { transform: translateY(-3px); transition: transform 0.3s var(--gf-ease); }
}
body.home .wp-site-blocks > .gf-main--front { margin-block-start: 0 !important; }
