/* =========================================================================
   LOVE LETTER — zmiany 2026-07 / 2026-08 (logo, menu 2 rzędy, karuzela,
   kafle oferty, dane produktu, wycena dynamiczna)
   Ładowane PO custom.css (nadpisuje ustawienia bazowe).
   ========================================================================= */

:root {
	/* Jedno źródło prawdy dla odstępów w sekcji „Oferta" na stronie głównej. */
	--ll-tile-gap: 1rem;
	/* Wysokość dużej grafiki „Zaproszenia" — wyznacza wysokość całego bloku. */
	--ll-tile-hero-h: 460px;
}

/* =========================================================================
   WYŚRODKOWANIE TEKSTU (2026-08)

   custom.css ogranicza szerokość akapitów regułą `p { max-width: 68ch }`,
   ale bez marginesów automatycznych. Efekt: akapit z wyrównaniem do środka
   miał wyśrodkowany TEKST wewnątrz bloku, a sam blok przywierał do lewej
   krawędzi sekcji (nagłówki, bez limitu szerokości, wyglądały poprawnie).
   Poniższa reguła centruje sam blok — działa na wszystkich podstronach.
   ========================================================================= */
p.has-text-align-center { margin-inline: auto; }

/* To samo dla nadtytułów (.ll-eyebrow jest akapitem z układem flex). */
.ll-eyebrow.has-text-align-center { margin-inline: auto; }

/* Elementy blokowe z ograniczoną szerokością, wyrównane do środka. */
.has-text-align-center > .wp-block-group__inner-container > p,
figure.has-text-align-center { margin-inline: auto; }

/* =========================================================================
   LOGO (2026-08) — wypełnia praktycznie całą wysokość paska z menu.
   Powiększenie logo + zmniejszenie paddingu wiersza nagłówka, aby to logo
   definiowało wysokość paska, a nie rozpychało go w nieskończoność.
   ========================================================================= */
.ll-header .ll-headrow { padding-top: .5rem; padding-bottom: .5rem; }
.ll-header.is-scrolled .ll-headrow { padding-top: .35rem; padding-bottom: .35rem; }

.ll-header .wp-block-site-logo img { max-height: 112px; }
.ll-header.is-scrolled .wp-block-site-logo img { max-height: 68px; }
@media (max-width: 781px) {
	.ll-header .ll-headrow { padding-top: .45rem; padding-bottom: .45rem; }
	.ll-header .wp-block-site-logo img { max-height: 64px; }
}
@media (max-width: 600px) {
	.ll-header .wp-block-site-logo img { max-height: 52px; }
}

/* ---------- Menu główne w jednym rzędzie z separatorami (desktop od 1025 px) ---------- */
@media (min-width: 1025px) {
	.ll-header .wp-block-navigation__container {
		display: flex !important;
		flex-wrap: nowrap;
		justify-content: center;
		align-items: center;
		column-gap: 0;
		row-gap: 0;
	}
	.ll-header .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content {
		padding-inline: clamp(.4rem, .85vw, .95rem);
		font-size: clamp(.66rem, .8vw, .8rem);
		white-space: nowrap;
	}
	.ll-header .wp-block-navigation__container > .wp-block-navigation-item + .wp-block-navigation-item::before {
		content: "/";
		display: inline-block;
		color: var(--ll-gold, #A0834E);
		opacity: .55;
		font-size: .78em;
		line-height: 1;
	}
	/* nie dotyczy podmenu rozwijanych */
	.ll-header .wp-block-navigation__submenu-container { display: block !important; grid-template-columns: none !important; }
	.ll-header .wp-block-navigation__submenu-container .wp-block-navigation-item::before { content: none !important; }
}

/* =========================================================================
   KARUZELA BANERÓW (dowolna liczba slajdów, stały rozmiar)
   ========================================================================= */
.ll-carousel {
	position: relative;
	width: 100%;
	overflow: hidden;
	background: var(--ll-linen);
	aspect-ratio: 2150 / 732;   /* stały rozmiar niezależny od urządzenia */
	max-height: 72vh;
}
/* Pełna szerokość okna — niezależnie od zagnieżdżenia w kontenerach z paddingiem.
   Naprawia „ucięcie" slajdera z prawej strony (nadpisuje wyliczenia alignfull). */
.ll-carousel.alignfull {
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
}
.ll-carousel__track {
	display: flex;
	height: 100%;
	margin: 0;
	padding: 0;
	transition: transform var(--dur-2) var(--ll-ease);
	will-change: transform;
}
.ll-carousel__slide {
	position: relative;
	flex: 0 0 100%;
	width: 100%;
	height: 100%;
	margin: 0;
}
.ll-carousel__slide img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
/* Fallback zanim JS oznaczy jako gotową: przewijalny pas */
.ll-carousel:not(.is-ready) .ll-carousel__track { overflow-x: auto; scroll-snap-type: x mandatory; }
.ll-carousel:not(.is-ready) .ll-carousel__slide { scroll-snap-align: center; }

/* Strzałki */
.ll-carousel__arrow {
	position: absolute; top: 50%; transform: translateY(-50%);
	z-index: 5;
	width: 52px; height: 52px;
	display: flex; align-items: center; justify-content: center;
	border: 0; cursor: pointer;
	background: rgba(20,17,15,.42);
	color: #fff; border-radius: 50%;
	transition: background var(--dur-1) var(--ll-ease);
	-webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px);
}
.ll-carousel__arrow:hover { background: rgba(20,17,15,.72); }
.ll-carousel__arrow--prev { left: clamp(.75rem, 2vw, 1.75rem); }
.ll-carousel__arrow--next { right: clamp(.75rem, 2vw, 1.75rem); }
.ll-carousel__arrow svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }

/* Kropki */
.ll-carousel__dots {
	position: absolute; left: 0; right: 0; bottom: clamp(.75rem, 2vw, 1.4rem);
	z-index: 5;
	display: flex; gap: .55rem; justify-content: center;
}
.ll-carousel__dot {
	width: 10px; height: 10px; padding: 0; border: 0; cursor: pointer;
	border-radius: 50%;
	background: rgba(255,255,255,.55);
	transition: background var(--dur-1) var(--ll-ease), transform var(--dur-1) var(--ll-ease);
}
.ll-carousel__dot:hover { background: rgba(255,255,255,.85); }
.ll-carousel__dot.is-active { background: #fff; transform: scale(1.25); }

@media (max-width: 781px) {
	.ll-carousel { aspect-ratio: 16 / 10; }   /* na telefonie wyższy kadr (obraz kadrowany) */
	.ll-carousel__arrow { width: 42px; height: 42px; }
}
@media (prefers-reduced-motion: reduce) {
	.ll-carousel__track { transition: none; }
}

/* =========================================================================
   KAFLE OFERTY — dodatkowe kategorie (siatka + delikatne powiększenie)
   ========================================================================= */
.ll-tiles {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));
	gap: var(--ll-tile-gap);
}
.ll-card--solid { border-radius: 2px; }
.ll-card--solid .wp-block-cover__inner-container { transition: transform var(--dur-2) var(--ll-ease); }
.ll-card--solid:hover .wp-block-cover__inner-container { transform: scale(1.05); }
/* Etykiety kafli — krój szeryfowy (Cormorant), spójnie z „Zaproszenia" */
.ll-tiles .ll-card h3 { font-family: var(--wp--preset--font-family--display); }

/* =========================================================================
   OFERTA 2026-08 — układ mozaikowy wyrównany do dużej grafiki.

   Obie siatki (górna i dolna) mają TE SAME 4 kolumny, więc wszystkie
   krawędzie pionowe pokrywają się z krawędzią dużej grafiki „Zaproszenia".
   Wysokość bloku górnego wyznacza duża grafika (--ll-tile-hero-h), a dwa
   rzędy po prawej dzielą ją równo (1fr 1fr) — dolna krawędź kafla
   „Tablice" leży dokładnie na dolnej krawędzi grafiki.
   Wszystkie odstępy (w poziomie, w pionie i między rzędami) = --ll-tile-gap.
   ========================================================================= */
.ll-oferta-top {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	grid-template-rows: 1fr 1fr;
	gap: var(--ll-tile-gap);
	align-items: stretch;
	min-height: var(--ll-tile-hero-h);
}
.ll-oferta-top > .ll-of-a { grid-column: 1 / span 2; grid-row: 1 / span 2; }
.ll-oferta-top > .ll-of-b { grid-column: 3; grid-row: 1; }
.ll-oferta-top > .ll-of-c { grid-column: 4; grid-row: 1; }
.ll-oferta-top > .ll-of-d { grid-column: 3 / span 2; grid-row: 2; }

.ll-oferta-row {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: var(--ll-tile-gap);
	margin-top: var(--ll-tile-gap);
	min-height: 210px;
}

/* Kafel wypełnia komórkę siatki. Neutralizuje sztywne min-height wpisane
   w treści strony (460/235/235/210 px), które powodowały rozjazd o 9 px. */
.ll-oferta-top > .ll-card,
.ll-oferta-row > .ll-card {
	min-height: 0 !important;
	height: 100%;
}

/* WordPress nadaje każdej grupie o układzie „flow" regułę
       :root :where(.is-layout-flow) > * { margin-block-start: 1.6rem }
   W siatce CSS taki margines nie tworzy odstępu — przesuwa kafel w dół
   wewnątrz jego komórki. Efekt: pierwszy kafel siatki (margines 0) siedział
   o ~25 px wyżej niż wszystkie pozostałe, mimo poprawnych kolumn i wysokości.

   Zerujemy odstępy pionowe wewnątrz siatek — za odległości między kaflami
   odpowiada wyłącznie `gap`. !important, bo nadpisujemy globalny arkusz
   generowany dynamicznie przez WordPressa. */
.ll-oferta-top > *,
.ll-oferta-row > *,
.ll-tiles > *,
.ll-trust > * {
	margin-block-start: 0 !important;
	margin-block-end: 0 !important;
}

/* Kafle graficzne — tło (grafika botaniczna) na całość, etykieta u dołu */
.ll-oferta-top .ll-card,
.ll-oferta-row .ll-card { border-radius: 2px; }
.ll-oferta-top .ll-card h3,
.ll-oferta-row .ll-card h3 { font-family: var(--wp--preset--font-family--display); }

/* Responsywność */
@media (max-width: 900px) {
	.ll-oferta-top {
		grid-template-columns: 1fr 1fr;
		grid-template-rows: auto;
		min-height: 0;
	}
	.ll-oferta-top > .ll-of-a { grid-column: 1 / span 2; grid-row: auto; min-height: 320px !important; }
	.ll-oferta-top > .ll-of-b { grid-column: 1; grid-row: auto; min-height: 210px !important; }
	.ll-oferta-top > .ll-of-c { grid-column: 2; grid-row: auto; min-height: 210px !important; }
	.ll-oferta-top > .ll-of-d { grid-column: 1 / span 2; grid-row: auto; min-height: 210px !important; }
	.ll-oferta-row { grid-template-columns: repeat(2, 1fr); min-height: 0; }
	.ll-oferta-row > .ll-card { min-height: 190px !important; }
}
@media (max-width: 560px) {
	.ll-oferta-top { grid-template-columns: 1fr; }
	.ll-oferta-top > .ll-of-a,
	.ll-oferta-top > .ll-of-b,
	.ll-oferta-top > .ll-of-c,
	.ll-oferta-top > .ll-of-d { grid-column: 1; }
	.ll-oferta-row { grid-template-columns: 1fr 1fr; }
}

/* =========================================================================
   DANE PRODUKTU (2026-08) — model / rozmiar / cena, jedna informacja
   w osobnym wierszu zamiast jednego ciągu tekstu.
   ========================================================================= */
.ll-specs {
	list-style: none;
	margin: 1.35rem 0 0;
	padding: 0;
}
.ll-specs li {
	display: flex;
	flex-wrap: wrap;
	gap: .25rem .75rem;
	padding: .6rem 0;
	border-bottom: 1px solid rgba(20,17,15,.12);
	line-height: 1.55;
}
.ll-specs li:first-child { border-top: 1px solid rgba(20,17,15,.12); }
.ll-specs li strong {
	flex: 0 0 auto;
	min-width: 9rem;
	font-weight: 600;
	letter-spacing: .02em;
}
.ll-specs li span { flex: 1 1 12rem; }
.ll-specs li.ll-specs--note {
	border-bottom: 0;
	color: var(--wp--preset--color--gray, #6E655C);
	font-size: .92rem;
}
@media (max-width: 480px) {
	.ll-specs li strong { min-width: 100%; }
}

/* Informacja o minimalnym nakładzie / progu cenowym na karcie produktu */
.ll-min-note {
	margin: .75rem 0 0;
	padding: .85rem 1rem;
	background: rgba(20,17,15,.04);
	border-left: 2px solid rgba(20,17,15,.25);
	font-size: .92rem;
	line-height: 1.55;
}
.ll-min-note strong { font-weight: 600; }

/* =========================================================================
   WYCENA DYNAMICZNA (2026-08) — cena przelicza się przy zmianie ilości
   ========================================================================= */
.ll-qty-price {
	margin: 1rem 0 1.25rem;
	padding: 1rem 1.15rem;
	border: 1px solid rgba(20,17,15,.14);
	border-radius: 2px;
	background: rgba(20,17,15,.02);
	font-size: .95rem;
	line-height: 1.6;
	transition: border-color var(--dur-1, .2s) ease, background var(--dur-1, .2s) ease;
}
.ll-qty-price__calc { margin: 0; }
.ll-qty-price__total {
	font-weight: 600;
	font-size: 1.15em;
	white-space: nowrap;
}
.ll-qty-price__note {
	margin: .4rem 0 0;
	font-size: .88rem;
	color: var(--wp--preset--color--gray, #6E655C);
}

/* Próg małej serii — cena podwyższona */
.ll-qty-price.is-small {
	border-color: rgba(160,120,58,.45);
	background: rgba(190,150,70,.09);
}
.ll-qty-price.is-small .ll-qty-price__note { color: #8A6A2F; }

/* Poniżej absolutnego minimum — nie można dodać do koszyka */
.ll-qty-price.is-blocked {
	border-color: rgba(160,72,58,.5);
	background: rgba(160,72,58,.08);
}
.ll-qty-price.is-blocked .ll-qty-price__note { color: #A0483A; font-weight: 500; }

/* Zablokowany przycisk dodania do koszyka */
.woocommerce div.product form.cart button.single_add_to_cart_button.ll-disabled,
.woocommerce div.product form.cart button.single_add_to_cart_button[disabled] {
	opacity: .45;
	cursor: not-allowed;
	pointer-events: none;
}

/* =========================================================================
   KATEGORIE BEZ PRODUKTÓW — komunikat zamiast pustej strony
   ========================================================================= */
.ll-empty-cat {
	max-width: 46rem;
	margin: 2.5rem auto 3.5rem;
	padding: 2.5rem 2rem;
	text-align: center;
	background: rgba(20,17,15,.03);
	border: 1px solid rgba(20,17,15,.10);
	border-radius: 2px;
}
.ll-empty-cat h2 {
	margin: 0 0 .75rem;
	font-family: var(--wp--preset--font-family--display);
}
.ll-empty-cat p { margin: 0 0 1.5rem; }

/* =========================================================================
   FORMULARZ KONTAKTOWY — komunikaty po wysłaniu
   ========================================================================= */
.ll-form-msg {
	margin: 0 0 1.25rem;
	padding: .9rem 1.1rem;
	border-radius: 2px;
	font-size: .95rem;
	line-height: 1.55;
}
.ll-form-msg--ok { background: rgba(92,116,87,.12); border-left: 3px solid #5C7457; }
.ll-form-msg--err { background: rgba(160,72,58,.10); border-left: 3px solid #A0483A; }
/* pułapka antyspamowa — niewidoczna dla ludzi, widoczna dla botów */
.ll-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

/* =========================================================================
   UWAGI KLIENTA 2026-08 (druga tura) — nagłówek, wersja mobilna,
   sekcje strony głównej, „Dobierz do kompletu".
   Ten arkusz ładuje się PO custom.css, więc nadpisuje ustawienia bazowe.
   ========================================================================= */

/* ---------- Odstęp: ciemny pasek ↔ pasek z menu ---------- */
.ll-header .ll-topbar { padding-top: .3rem; padding-bottom: .3rem; }
.ll-header .ll-headrow { padding-top: .25rem; padding-bottom: .25rem; }
.ll-header.is-scrolled .ll-headrow { padding-top: .2rem; padding-bottom: .2rem; }

/* ---------- Menu mobilne: wyłącznie hamburger do 1024 px ----------
   Telefon obrócony poziomo ma ok. 850–930 px szerokości — przy starym
   progu 781 px włączał się układ desktopowy i menu wychodziło poza ekran. */
@media (max-width: 1024px) {
	.ll-header .wp-block-navigation__responsive-container:not(.is-menu-open) { display: none !important; }
	.ll-header .wp-block-navigation__responsive-container-open { display: flex !important; }
	.ll-header .wp-block-navigation { flex: 0 0 auto; }
}

/* ---------- Ikona logowania widoczna także na telefonie ---------- */
@media (max-width: 781px) {
	.ll-utils .wp-block-loginout { display: inline-flex !important; }
}
@media (max-width: 600px) {
	.ll-header .ll-utils { gap: 0 !important; }
	.ll-header .ll-utils .wp-block-search__button,
	.ll-header .ll-utils .wp-block-loginout a,
	.ll-header .ll-utils .wc-block-mini-cart__button { padding: .3rem !important; }
	.ll-header .ll-utils .wp-block-search__button svg,
	.ll-header .ll-utils .wc-block-mini-cart__button svg { width: 18px; height: 18px; }
	.ll-header .ll-utils .wp-block-loginout a::before { font-size: 18px; }
}

/* ---------- Baner (karuzela) na telefonie: cały kadr, bez ucięcia boków ---------- */
@media (max-width: 781px) {
	.ll-carousel { aspect-ratio: 2150 / 732; max-height: none; }
	.ll-carousel__slide img { object-fit: contain; background: var(--ll-linen); }
	.ll-carousel__dots { bottom: .4rem; }
	.ll-carousel__dot { width: 8px; height: 8px; }
}

/* =========================================================================
   KAFLE — etykieta i odnośnik przyklejone do dolnej krawędzi zdjęcia,
   dzięki czemu wszystkie CTA leżą na jednej wysokości niezależnie od
   długości tytułu i od rozdzielczości ekranu.
   ========================================================================= */
.ll-card .wp-block-cover__inner-container {
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	height: 100%;
	box-sizing: border-box;
	padding: clamp(1rem, 2vw, 1.6rem);
}
.ll-card .wp-block-cover__inner-container > * { margin-block: 0 !important; }
.ll-card .wp-block-cover__inner-container > h3 { margin-bottom: .4rem !important; }

/* Siatka produktów — przyciski „Zobacz produkt" w jednej linii */
.woocommerce ul.products li.product .price { min-height: 1.6em; margin-bottom: 1rem; }
.woocommerce ul.products li.product .button { align-self: flex-start; }

/* =========================================================================
   SEKCJA „PROCES" — 7 kroków wg materiału klienta (proces.png)
   ========================================================================= */
.ll-proces-grid {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	gap: 0;
	align-items: stretch;
}
.ll-proces-grid > * { margin-block: 0 !important; }
.ll-proces-step {
	display: flex;
	flex-direction: column;
	padding: 0 clamp(.5rem, 1vw, 1.15rem);
	border-left: 1px solid rgba(20,17,15,.10);
}
.ll-proces-step:first-child { border-left: 0; }
.ll-proces-step > * { margin-block: 0 !important; }
.ll-proces-num {
	width: 62px;
	height: 62px;
	margin: 0 auto .9rem !important;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: #E3D6C6;
	font-family: var(--wp--preset--font-family--display);
	font-size: 1.7rem;
	line-height: 1;
}
.ll-proces-title {
	font-family: var(--wp--preset--font-family--body);
	text-transform: uppercase;
	letter-spacing: .08em;
	font-size: .78rem;
	line-height: 1.45;
	margin-bottom: 1rem !important;
	min-height: 3.6em;
}
.ll-proces-ikona { margin-bottom: 1rem !important; }
.ll-proces-ikona img { display: block; width: 100%; max-width: 175px; height: auto; margin: 0 auto; }
.ll-proces-desc {
	margin-top: auto !important;
	padding-top: 1rem;
	border-top: 1px solid rgba(20,17,15,.14);
	font-size: .82rem;
	line-height: 1.55;
	color: var(--ll-gray, #6E655C);
	max-width: none;
}
.ll-proces-outro {
	margin-top: 2.75rem !important;
	font-family: var(--wp--preset--font-family--display);
	font-style: italic;
	font-size: clamp(1.2rem, 2.4vw, 1.8rem);
	max-width: none;
}
@media (max-width: 1200px) {
	.ll-proces-grid { grid-template-columns: repeat(4, 1fr); row-gap: 2.75rem; }
	.ll-proces-step:nth-child(4n+1) { border-left: 0; }
}
@media (max-width: 900px) {
	.ll-proces-grid { grid-template-columns: repeat(3, 1fr); }
	.ll-proces-step { border-left: 0; }
	.ll-proces-step:nth-child(4n+1) { border-left: 0; }
}
@media (max-width: 600px) {
	.ll-proces-grid { grid-template-columns: repeat(2, 1fr); row-gap: 2.25rem; }
	.ll-proces-title { min-height: 0; }
	.ll-proces-num { width: 52px; height: 52px; font-size: 1.4rem; }
}

/* =========================================================================
   SEKCJA „DLACZEGO LOVE LETTER CO." — wg materiału klienta
   ========================================================================= */
.ll-script-sub {
	font-family: var(--wp--preset--font-family--display);
	font-style: italic;
	font-size: clamp(1.15rem, 2.2vw, 1.65rem);
	letter-spacing: .04em;
	color: var(--ll-gold, #A0834E);
	max-width: none;
}
.ll-why-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 0;
	align-items: stretch;
}
.ll-why-grid > * { margin-block: 0 !important; }
.ll-why-item {
	display: flex;
	flex-direction: column;
	padding: 0 clamp(1rem, 2vw, 2.25rem);
	border-left: 1px solid rgba(20,17,15,.10);
}
.ll-why-item:first-child { border-left: 0; }
.ll-why-item > * { margin-block: 0 !important; }
.ll-why-ikona { margin-bottom: 1.4rem !important; }
.ll-why-ikona img { display: block; width: 108px; height: 108px; margin: 0 auto; }
.ll-why-title {
	font-family: var(--wp--preset--font-family--display);
	text-transform: uppercase;
	letter-spacing: .12em;
	font-size: 1rem;
	line-height: 1.5;
	margin-bottom: .85rem !important;
	min-height: 3em;
}
.ll-why-heart {
	margin-top: 1.5rem !important;
	color: var(--ll-gold, #A0834E);
	font-size: .95rem;
	max-width: none;
}
@media (max-width: 900px) {
	.ll-why-grid { grid-template-columns: repeat(2, 1fr); row-gap: 3rem; }
	.ll-why-item { border-left: 0; }
}
@media (max-width: 560px) {
	.ll-why-grid { grid-template-columns: 1fr; }
	.ll-why-title { min-height: 0; }
}

/* ---------- „Projekt indywidualny" — linia akcentowa na czarnym tle ---------- */
.ll-accent-line {
	text-transform: uppercase;
	letter-spacing: .18em;
	font-size: .8rem;
}

/* =========================================================================
   REALIZACJE — galeria 5 kafli + „Najczęściej wybierane dodatki"
   ========================================================================= */
@media (max-width: 700px) {
	.ll-realizacje-galeria.columns-5 .wp-block-image { width: calc(50% - .625rem) !important; }
}
.ll-dodatki {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: var(--ll-tile-gap);
	align-items: stretch;
}
.ll-dodatki > * { margin-block: 0 !important; }
.ll-dod-card { height: 100%; border-radius: 2px; }
.ll-dod-card .wp-block-cover__inner-container { justify-content: center; }
.ll-dod-card h3 { font-family: var(--wp--preset--font-family--display); }
@media (max-width: 900px) { .ll-dodatki { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 560px) { .ll-dodatki { grid-template-columns: repeat(2, 1fr); } }

/* =========================================================================
   „DOBIERZ DO KOMPLETU" — produkty uzupełniające na karcie produktu

   WooCommerce układa zdjęcie produktu (float: left) i podsumowanie
   (float: right) na pływających kolumnach. Bez `clear: both` nasza sekcja
   wchodziła w ten układ: nagłówek i akapit wyliczały szerokość względem
   miejsca pozostałego obok zdjęcia, przez co tekst był przesunięty
   i łamał się w przypadkowych miejscach, a kafle wychodziły poza kolumnę.
   Dodatkowo siatka kafli jest teraz elastyczna (flex), więc przy 2, 3 czy 5
   produktach rząd zawsze jest wyśrodkowany i nigdy się nie rozjeżdża.
   ========================================================================= */
.ll-upsell {
	clear: both;
	float: none;
	width: 100%;
	box-sizing: border-box;
	margin: clamp(2.5rem, 5vw, 4rem) 0 3rem;
	padding-top: clamp(2rem, 4vw, 3rem);
	border-top: 1px solid rgba(20,17,15,.12);
}
.ll-upsell__title {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 500;
	font-size: clamp(1.5rem, 3vw, 2.2rem);
	line-height: 1.2;
	text-align: center;
	max-width: none;
	margin: 0 0 .55rem;
}
.ll-upsell__lead {
	text-align: center;
	font-size: .92rem;
	line-height: 1.6;
	color: var(--ll-gray, #6E655C);
	max-width: 46rem;
	margin: 0 auto 2rem;
}
.ll-upsell__grid {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: stretch;
	gap: clamp(.8rem, 1.5vw, 1.4rem);
	list-style: none;
	margin: 0;
	padding: 0;
}
.woocommerce .ll-upsell__grid::before,
.woocommerce .ll-upsell__grid::after { content: none; display: none; }
.ll-upsell__item {
	flex: 0 1 clamp(8.5rem, 18%, 16.5rem);
	min-width: 0;
	max-width: 16.5rem;
	margin: 0;
	padding: 0;
	list-style: none;
}
.ll-upsell__item::before { content: none; }
.ll-upsell__link {
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	color: inherit;
}
.ll-upsell__img {
	display: block;
	overflow: hidden;
	border-radius: 2px;
	background: var(--ll-linen);
	margin-bottom: .7rem;
}
.ll-upsell__img img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 5;
	object-fit: cover;
	transition: transform var(--dur-2, .35s) var(--ll-ease, ease);
}
.ll-upsell__item:hover .ll-upsell__img img { transform: scale(1.05); }
.ll-upsell__name {
	display: block;
	font-size: .85rem;
	line-height: 1.4;
	margin: 0 0 .35rem;
}
.ll-upsell__price {
	display: block;
	font-size: .85rem;
	margin: auto 0 0;
	color: var(--ll-gray, #6E655C);
}
.ll-upsell__price .amount { white-space: nowrap; }
@media (max-width: 600px) {
	.ll-upsell__item { flex: 0 1 calc(50% - .8rem); }
	.ll-upsell__lead { font-size: .88rem; margin-bottom: 1.5rem; }
}
/* =========================================================================
   SEKCJE CZASOWO WYŁĄCZONE — treść pozostaje w edytorze, nie jest
   wyświetlana na stronie. Aby przywrócić sekcję, usuń klasę ll-hidden
   z bloku w edytorze (Ustawienia bloku → Zaawansowane → Dodatkowe klasy CSS).
   ========================================================================= */
.ll-hidden { display: none !important; }

/* =========================================================================
   UWAGI KLIENTA 2026-08-20 (druga lista)
   ========================================================================= */

/* ---------- 1. Ikony w nagłówku na jednej linii ----------
   Lupka siedziała wyżej od ikony konta i koszyka: przycisk wyszukiwarki
   dostawał wysokość z paddingu (min-height 44px + padding .5rem), a ikona
   konta i koszyk mają sztywne 44×44 z wyśrodkowaniem flex. Ujednolicamy
   wszystkie trzy do identycznego pudełka 44×44 wyśrodkowanego w obu osiach. */
.ll-header .ll-utils { align-items: center !important; }
.ll-header .ll-utils > * { display: flex; align-items: center; margin: 0; }
.ll-header .ll-utils .wp-block-search,
.ll-header .ll-utils .wp-block-search__inside-wrapper { display: flex; align-items: center; margin: 0; }
.ll-header .ll-utils .wp-block-search__button {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	min-width: 44px;
	min-height: 44px;
	padding: 0 !important;
	margin: 0 !important;
	line-height: 1;
}
.ll-header .ll-utils .wp-block-loginout a,
.ll-header .ll-utils .wc-block-mini-cart__button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	line-height: 1;
}

/* ---------- 2. Menu mobilne — pełnoekranowa nakładka ----------
   `.ll-header` ma backdrop-filter, a element z filtrem tworzy tzw. containing
   block dla potomków `position: fixed`. Nakładka menu (fixed inset:0) była
   więc zamykana w obrębie samego nagłówka — stąd zakładki wciśnięte w prawy
   górny róg i ucięte. Na czas otwartego menu wyłączamy filtr. */
html.has-modal-open .ll-header,
.ll-header:has(.wp-block-navigation__responsive-container.is-menu-open) {
	backdrop-filter: none !important;
	-webkit-backdrop-filter: none !important;
	background: #FFFFFF;
}
.ll-header .wp-block-navigation__responsive-container.is-menu-open {
	background-color: var(--ll-linen, #F4EFE8);
	padding: clamp(4.5rem, 14vw, 6rem) 1.5rem 3rem;
}
.ll-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	width: 100%;
	align-items: center;
	justify-content: flex-start;
}
.ll-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	display: flex !important;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	gap: 1.15rem;
	width: 100%;
}
.ll-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
	width: 100%;
	text-align: center;
}
.ll-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item::before { content: none !important; }
.ll-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	display: inline-block;
	font-size: 1.02rem;
	letter-spacing: .16em;
	padding: .4rem .5rem;
	white-space: normal;
}
.ll-header .wp-block-navigation__responsive-container-close {
	width: 44px;
	height: 44px;
	padding: 0;
}

/* ---------- 3. Przyciski w siatce produktów ----------
   a) custom.css nadaje przyciskom `margin: 0` PO regule `margin-top: auto`,
      przez co przestawały przyklejać się do dołu karty — przy produkcie bez
      ceny albo z krótszym tytułem przycisk lądował wyżej niż w sąsiedniej
      karcie. Przywracamy przyklejenie do dołu.
   b) `width: 100%` przy box-sizing: content-box powodowało, że przycisk był
      szerszy od kafla o padding i obramowanie i wychodził poza kartę
      (widoczne zwłaszcza na telefonie).
   c) Na wąskich ekranach przycisk jest teraz mniejszy i łamie tekst. */
.woocommerce ul.products li.product .button,
.woocommerce-page ul.products li.product .button {
	margin-top: auto !important;
	margin-bottom: 0 !important;
	box-sizing: border-box;
	width: 100%;
	max-width: 100%;
	white-space: normal;
	text-align: center;
	line-height: 1.3;
	padding: .85em 1rem;
	font-size: .7rem;
	letter-spacing: .12em;
	text-decoration: none;
}
.woocommerce ul.products li.product .price,
.woocommerce-page ul.products li.product .price { margin-bottom: 1rem !important; }
.woocommerce ul.products li.product .added_to_cart { box-sizing: border-box; width: 100%; }

@media (max-width: 900px) {
	.woocommerce ul.products li.product .button,
	.woocommerce-page ul.products li.product .button {
		padding: .75em .5rem;
		font-size: .62rem;
		letter-spacing: .07em;
	}
	.woocommerce ul.products li.product .woocommerce-loop-product__title,
	.woocommerce-page ul.products li.product .woocommerce-loop-product__title {
		font-size: 1.02rem;
		min-height: 0;
	}
	.woocommerce ul.products li.product .price,
	.woocommerce-page ul.products li.product .price {
		font-size: .92rem !important;
		margin-bottom: .75rem !important;
	}
}
@media (max-width: 420px) {
	.woocommerce ul.products li.product .button,
	.woocommerce-page ul.products li.product .button { padding: .7em .35rem; font-size: .58rem; letter-spacing: .05em; }
}

/* ---------- 4. Ciemne przyciski poza siatką produktów ----------
   Linki `<a class="button">` renderowane poza kontenerem `.woocommerce`
   (np. komunikat pustej kategorii) zachowywały się jak zwykły tekst inline:
   padding pionowy nie zwiększał wysokości wiersza, więc tło wylewało się
   poza przycisk i sąsiednie przyciski nachodziły na siebie. */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce .button,
.woocommerce #respond input#submit,
button.single_add_to_cart_button,
.ll-empty-cat .button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	vertical-align: middle;
	text-decoration: none;
}
.ll-empty-cat__actions {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: .85rem;
	margin-top: .5rem;
}
.ll-empty-cat .button {
	position: relative;
	overflow: hidden;
	isolation: isolate;
	border-radius: 2px;
	border: 1px solid var(--ll-black, #14110F);
	background: var(--ll-black, #14110F);
	color: var(--ll-white, #FFF);
	font-family: var(--wp--preset--font-family--body);
	font-size: .74rem;
	font-weight: 500;
	line-height: 1.2;
	letter-spacing: .14em;
	text-transform: uppercase;
	padding: 1em 2.2em;
	transition: background var(--dur-1, .2s) var(--ll-ease, ease), color var(--dur-1, .2s) var(--ll-ease, ease);
}
.ll-empty-cat .button::before { content: none !important; }
.ll-empty-cat .button:hover { background: var(--ll-espresso, #3D352E); border-color: var(--ll-espresso, #3D352E); color: #FFF; }
.ll-empty-cat .button + .button { margin-left: 0; }
@media (max-width: 480px) {
	.ll-empty-cat__actions { flex-direction: column; align-items: stretch; }
	.ll-empty-cat .button { width: 100%; padding: .95em 1rem; font-size: .7rem; }
}

/* =========================================================================
   STREFA KLIENTA — menu boczne „Moje konto"

   Arkusz WooCommerce dla motywów blokowych (woocommerce-blocktheme.css)
   nadaje odstęp elementowi listy:
       .woocommerce-MyAccount-navigation li { padding: 1em 0 }
   a nasze zaznaczenie (czarne tło) maluje się na linku w środku — dlatego
   podświetlenie nie sięgało górnej i dolnej krawędzi wiersza. Przenosimy
   cały odstęp z <li> na <a>, więc tło wypełnia teraz pozycję w całości.
   Ten sam arkusz podkreśla aktywną pozycję
       li.is-active a { text-decoration: underline }
   — podkreślenie zdejmujemy, bo zaznaczeniem jest tło.
   ========================================================================= */
.woocommerce-account .woocommerce-MyAccount-navigation ul {
	overflow: hidden;
	border-radius: 3px;
}
.woocommerce-account .woocommerce-MyAccount-navigation li,
.woocommerce-account .woocommerce-MyAccount-navigation li:first-child,
.woocommerce-account .woocommerce-MyAccount-navigation li:last-child {
	padding: 0 !important;
	margin: 0 !important;
	list-style: none;
}
.woocommerce-account .woocommerce-MyAccount-navigation li a {
	display: block;
	box-sizing: border-box;
	width: 100%;
	padding: 1.15rem 1.4rem;
	text-decoration: none !important;
	border: 0;
}
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a,
.woocommerce-account .woocommerce-MyAccount-navigation li a:hover,
.woocommerce-account .woocommerce-MyAccount-navigation li a:focus {
	background: var(--ll-black, #14110F);
	color: #FFFFFF !important;
	text-decoration: none !important;
}
/* Czytelny obrys przy nawigacji klawiaturą (tło jest już czarne). */
.woocommerce-account .woocommerce-MyAccount-navigation li a:focus-visible {
	outline: 2px solid var(--ll-gold, #A0834E);
	outline-offset: -4px;
}
@media (max-width: 781px) {
	.woocommerce-account .woocommerce-MyAccount-navigation li a { padding: 1rem 1.15rem; }
}

/* =========================================================================
   PRZYCISKI — dolne wydłużenia liter (J, Ź, ą, ę, y) nie mogą być ucinane

   Firmowy styl przycisków w custom.css łączy trzy rzeczy:
       line-height: 1;  overflow: hidden;  ::before { transform: translateY(101%) }
   Przy `line-height: 1` pudełko tekstu ma wysokość dokładnie jednego „em",
   więc ogonki liter wychodzą poza nie, a `overflow: hidden` je przycina.
   Najbardziej widać to na wersalikach z wydłużeniem dolnym — np.
   „PRZEJDŹ DO SKLEPU”. Podnosimy interlinię do wartości bezpiecznej dla
   polskich znaków diakrytycznych; wysokość przycisków rośnie o ~3 px.
   ========================================================================= */
.wp-block-button__link,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce .button,
.woocommerce #respond input#submit,
button.single_add_to_cart_button {
	line-height: 1.3;
}

/* =========================================================================
   STREFA KLIENTA — przyciski w treści zakładek

   Tu dodatkowo rezygnujemy z animowanej nakładki `::before` (to ona przy
   niesprzyjającym układzie potrafi zostawić ciemny pasek pod przyciskiem)
   i z przycinania zawartości. Efekt najechania realizuje zwykła zmiana tła.
   ========================================================================= */
.woocommerce-account .woocommerce-MyAccount-content .button,
.woocommerce-account .woocommerce-MyAccount-content button.button,
.woocommerce-account .woocommerce-MyAccount-content input.button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	overflow: visible;
	line-height: 1.35;
	min-height: 46px;
	padding: .85em 2.1em;
	white-space: normal;
	text-align: center;
	text-decoration: none !important;
	vertical-align: middle;
}
.woocommerce-account .woocommerce-MyAccount-content .button::before,
.woocommerce-account .woocommerce-MyAccount-content button.button::before,
.woocommerce-account .woocommerce-MyAccount-content input.button::before { content: none !important; }
.woocommerce-account .woocommerce-MyAccount-content .button:hover,
.woocommerce-account .woocommerce-MyAccount-content button.button:hover,
.woocommerce-account .woocommerce-MyAccount-content input.button:hover {
	background: var(--ll-espresso, #3D352E);
	border-color: var(--ll-espresso, #3D352E);
	color: #FFFFFF;
}
/* Odstęp, gdy w jednym wierszu stoją dwa przyciski (np. „Zapisz treść” i „Proszę o poprawki”). */
.woocommerce-account .woocommerce-MyAccount-content .button + .button,
.woocommerce-account .woocommerce-MyAccount-content button.button + button.button { margin-left: .6rem; }
.woocommerce-account .woocommerce-MyAccount-content p .button { margin-block: .25rem; }
@media (max-width: 480px) {
	.woocommerce-account .woocommerce-MyAccount-content .button,
	.woocommerce-account .woocommerce-MyAccount-content button.button {
		width: 100%;
		margin-left: 0 !important;
		margin-bottom: .6rem;
	}
}

/* ==================================================================
   LL-2026-08-21 — sekcje pelnej szerokosci bez bialej szczeliny
   Domyslny blockGap (1.6rem z theme.json) wstawial bialy pasek
   pomiedzy kolejne pasy sekcji o roznych tlach (uwagi klientki).
   Sekcje maja wlasne paddingi, wiec odstep miedzy sasiadujacymi
   blokami alignfull zerujemy. Zwykla tresc zachowuje swoj rytm.
   ================================================================== */
.wp-block-post-content > .alignfull + .alignfull,
.entry-content > .alignfull + .alignfull { margin-block-start: 0; }
/* =====================================================================
   Strefa Klienta — adresy i Moje projekty (2026-10)
   Adresy korzystają z własnego szablonu (woocommerce/myaccount/my-address.php),
   bo oryginał WooCommerce układa kolumny floatami, które rozsypują się
   w motywie blokowym.
   ===================================================================== */

/* ---------- ADRESY ---------- */

.ll-adresy-wstep {
	margin: 0 0 1.5rem;
	color: #6F6A62;
}

.ll-adresy {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1.5rem;
	align-items: start;
}

.ll-adres {
	border: 1px solid #E4DDD2;
	border-radius: 3px;
	padding: 1.4rem 1.5rem 1.5rem;
	background: #fff;
}

.ll-adres__naglowek {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 1rem;
	padding-bottom: 0.75rem;
	border-bottom: 1px solid #F0EBE3;
}

.ll-adres__tytul {
	margin: 0;
	font-size: 1.1rem;
	line-height: 1.3;
	font-weight: 500;
}

.ll-adres__edytuj {
	flex: 0 0 auto;
	font-size: 0.75rem;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	text-decoration: none;
	color: #6F6A62;
	border-bottom: 1px solid #D8D0C4;
	padding-bottom: 2px;
	white-space: nowrap;
	transition: color 0.15s, border-color 0.15s;
}

.ll-adres__edytuj:hover,
.ll-adres__edytuj:focus {
	color: #1A1A1A;
	border-bottom-color: #1A1A1A;
}

.ll-adres__tresc {
	font-style: normal;
	line-height: 1.7;
	margin: 0;
}

.ll-adres__pusty {
	margin: 0;
	color: #8A8379;
}

/* ---------- MOJE PROJEKTY ---------- */

.ll-projekty-wstep {
	margin: 0 0 1.75rem;
	color: #6F6A62;
}

.ll-projekty-pusto {
	border: 1px solid #E4DDD2;
	border-radius: 3px;
	padding: 2rem;
	text-align: center;
	background: #FCFAF7;
}

.ll-projekt {
	border: 1px solid #E4DDD2;
	border-radius: 3px;
	background: #fff;
	margin-bottom: 2rem;
	overflow: hidden;
}

.ll-projekt__naglowek {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 0.75rem;
	padding: 1.25rem 1.5rem;
	background: #FCFAF7;
	border-bottom: 1px solid #F0EBE3;
}

.ll-projekt__tytul {
	margin: 0;
	font-size: 1.15rem;
	font-weight: 500;
	line-height: 1.2;
}

.ll-projekt__status {
	font-size: 0.75rem;
	text-transform: uppercase;
	letter-spacing: 0.07em;
	font-weight: 600;
	color: var(--ll-status, #55606E);
	border: 1px solid currentColor;
	border-radius: 2em;
	padding: 0.35em 0.9em;
	white-space: nowrap;
}

/* Pasek postępu */
.ll-kroki {
	display: flex;
	list-style: none;
	margin: 0;
	padding: 1.1rem 1.5rem 0;
	gap: 0;
	counter-reset: none;
}

.ll-kroki__krok {
	flex: 1 1 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.4rem;
	position: relative;
	font-size: 0.75rem;
	text-align: center;
}

.ll-kroki__krok::before {
	content: "";
	position: absolute;
	top: 0.72rem;
	left: -50%;
	width: 100%;
	height: 1px;
	background: #E4DDD2;
	z-index: 0;
}

.ll-kroki__krok:first-child::before {
	display: none;
}

.ll-kroki__nr {
	position: relative;
	z-index: 1;
	width: 1.5rem;
	height: 1.5rem;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 0.72rem;
	font-weight: 600;
	background: #fff;
	border: 1px solid #D8D0C4;
	color: #8A8379;
}

.ll-kroki__krok--zrobiony .ll-kroki__nr {
	background: #2C6E49;
	border-color: #2C6E49;
	color: #fff;
}

.ll-kroki__krok--biezacy .ll-kroki__nr {
	background: #1A1A1A;
	border-color: #1A1A1A;
	color: #fff;
}

.ll-kroki__nazwa {
	color: #8A8379;
	letter-spacing: 0.03em;
}

.ll-kroki__krok--biezacy .ll-kroki__nazwa {
	color: #1A1A1A;
	font-weight: 600;
}

.ll-projekt__form {
	margin: 0;
}

.ll-projekt__sekcja {
	padding: 1.5rem;
	border-top: 1px solid #F0EBE3;
}

.ll-projekt__sekcja:first-of-type {
	border-top: none;
	padding-top: 1.25rem;
}

.ll-projekt__podtytul {
	margin: 0 0 0.4rem;
	font-size: 0.78rem;
	text-transform: uppercase;
	letter-spacing: 0.09em;
	font-weight: 600;
	color: #8A8379;
}

.ll-projekt__pomoc {
	margin: 0.5rem 0 0;
	font-size: 0.85rem;
	line-height: 1.6;
	color: #6F6A62;
}

.ll-projekt__pomoc--przy-przycisku {
	flex: 1 1 14rem;
	margin: 0;
}

.ll-projekt__pole {
	width: 100%;
	margin-top: 0.75rem;
	padding: 0.85rem 1rem;
	border: 1px solid #D8D0C4;
	border-radius: 3px;
	font: inherit;
	font-size: 0.95rem;
	line-height: 1.6;
	background: #fff;
	resize: vertical;
}

.ll-projekt__pole:focus {
	outline: none;
	border-color: #1A1A1A;
	box-shadow: 0 0 0 2px rgba(26, 26, 26, 0.08);
}

.ll-projekt__pole[readonly] {
	background: #F7F4EF;
	color: #6F6A62;
}

/* Kafelki projektów */
.ll-projekt__pliki {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
	gap: 1rem;
	margin-top: 0.9rem;
}

.ll-projekt__plik {
	display: flex;
	flex-direction: column;
	border: 1px solid #E4DDD2;
	border-radius: 3px;
	overflow: hidden;
	text-decoration: none;
	background: #fff;
	transition: border-color 0.15s, transform 0.15s;
}

.ll-projekt__plik:hover,
.ll-projekt__plik:focus {
	border-color: #1A1A1A;
	transform: translateY(-2px);
}

.ll-projekt__podglad {
	display: block;
	aspect-ratio: 4 / 5;
	background: #F7F4EF;
	overflow: hidden;
}

.ll-projekt__podglad img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.ll-projekt__podglad--plik {
	display: flex;
	align-items: center;
	justify-content: center;
}

.ll-projekt__ext {
	font-size: 1.05rem;
	letter-spacing: 0.12em;
	font-weight: 600;
	color: #8A8379;
	border: 2px solid #D8D0C4;
	border-radius: 3px;
	padding: 0.5em 0.8em;
}

.ll-projekt__opis {
	display: block;
	padding: 0.7rem 0.85rem 0.8rem;
	border-top: 1px solid #F0EBE3;
}

.ll-projekt__nazwa {
	display: block;
	font-size: 0.85rem;
	line-height: 1.4;
	color: #1A1A1A;
	word-break: break-word;
}

.ll-projekt__meta {
	display: block;
	margin-top: 0.2rem;
	font-size: 0.72rem;
	color: #8A8379;
}

.ll-projekt__uwaga {
	margin: 1.1rem 0 0;
	padding: 0.9rem 1.1rem;
	background: #FDF8EC;
	border-left: 3px solid #D9A441;
	font-size: 0.88rem;
	line-height: 1.6;
}

.ll-projekt__info {
	margin: 0;
	padding: 0.9rem 1.5rem;
	font-size: 0.9rem;
	border-top: 1px solid #F0EBE3;
}

.ll-projekt__info--ok {
	background: #F2F8F4;
	color: #22543D;
}

.ll-projekt__akcje {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.75rem 1rem;
	margin-top: 1rem;
}

.ll-projekt__akcje--glowne {
	margin-top: 1.1rem;
}

/* Przyciski — spójne z resztą Strefy, ale z wyraźną hierarchią. */
.woocommerce-account .woocommerce-MyAccount-content .ll-btn {
	margin: 0;
}

.woocommerce-account .woocommerce-MyAccount-content .ll-btn--drugi {
	background: #fff;
	color: #1A1A1A;
	border: 1px solid #1A1A1A;
}

.woocommerce-account .woocommerce-MyAccount-content .ll-btn--drugi:hover,
.woocommerce-account .woocommerce-MyAccount-content .ll-btn--drugi:focus {
	background: #1A1A1A;
	color: #fff;
}

@media (max-width: 767px) {
	.ll-adresy {
		grid-template-columns: minmax(0, 1fr);
		gap: 1rem;
	}

	.ll-projekt__sekcja,
	.ll-projekt__naglowek {
		padding: 1.1rem 1.1rem;
	}

	.ll-kroki {
		padding: 1rem 0.75rem 0;
	}

	.ll-kroki__nazwa {
		font-size: 0.68rem;
	}

	.ll-projekt__akcje {
		flex-direction: column;
		align-items: stretch;
	}

	.ll-projekt__akcje .ll-btn {
		width: 100%;
	}
}