/* Most UI Kit → markup wtyczki malarto-core, bloków WordPress i WooCommerce.
   Wersja skonsolidowana (MAL-367): jedna definicja na komponent, wartości z tokenów
   (wyjątki oznaczone), bez martwych bloków. Kolejność: układ → nagłówek/stopka → hero → wzorce → Program → karty → Format → Termin → formularze → promienie. */

/* ===== Układ i typografia strony ===== */
.malarto-document { max-width: 76ch; margin-inline: auto; padding-bottom: var(--malarto-s7); }
.malarto-document h2 { max-width: none; font-size: var(--malarto-size-lg); margin-top: var(--malarto-s6); }
.malarto-document p { line-height: 1.7; }
html, body.m-root { background: var(--malarto-ink); }
body.m-root { margin: 0; }
html:has(body.malarto-safari-variant-4) { background: transparent; }
body.m-root.malarto-safari-variant-4 { background: var(--malarto-paper); }
html, body { overflow-x: clip; }
.wp-site-blocks { display: flex; flex-direction: column; min-height: 100vh; background: var(--malarto-paper); }
.wp-site-blocks > * + * { margin-block-start: 0 !important; } /* blockGap z global styles robił pas między nagłówkiem a treścią */
.wp-site-blocks > main, .wp-site-blocks > .wp-block-group.alignfull:has(> main) { flex: 1 0 auto; }
/* Margines strony rośnie razem z ekranem (token --malarto-gutter), zamiast stałych 16 px. */
.wp-site-blocks > main, main.wp-block-group { padding-top: clamp(28px, 3.5vw, 50px) !important; padding-left: calc(var(--malarto-gutter) / 2); padding-right: calc(var(--malarto-gutter) / 2); }
body.home main.wp-block-group { padding-top: 0 !important; }
main h1, .wp-block-post-title { font: var(--malarto-weight-heavy) var(--malarto-size-h1-page)/1.02 var(--malarto-font-sans); letter-spacing: var(--malarto-tracking-tight); margin: 0 0 var(--malarto-s4); max-width: 16ch; text-wrap: balance; }
/* WP preset size classes use !important; inner-page H1 follows the shared page token. */
body:not(.home) main h1 { font-size: var(--malarto-size-h1-page) !important; }
main h2 { font: var(--malarto-weight-bold) var(--malarto-size-h2)/1.15 var(--malarto-font-sans); letter-spacing: -0.01em; max-width: var(--malarto-heading-measure); text-wrap: pretty; }
main h3 { font: var(--malarto-weight-semibold) 18px/1.3 var(--malarto-font-sans); }
main a:not([class]) { color: var(--malarto-glaze-dark); text-underline-offset: 3px; }
main a:not([class]):hover { color: var(--malarto-glaze); }
p.m-kicker { margin: 0 0 var(--malarto-s2); }
p.m-lede { max-width: 44ch; }
.m-intro { padding: 0 0 var(--malarto-s6); }
.wp-block-buttons.m-actions { gap: var(--malarto-s3); }
.wp-block-post-title.alignwide { max-width: var(--wp--style--global--content-size, 760px); margin-inline: auto; }
.is-layout-constrained > :where(h1, h2, h3, p.m-lede, p.m-kicker, .m-intro, .wp-block-buttons, .m-breadcrumbs, .m-kicker):not(.alignwide):not(.alignfull),
.m-intro > *, .wp-block-group.m-section > :where(h2, p, .wp-block-buttons, .wp-block-columns, .wp-block-group, figure) { margin-left: calc((100% - min(100%, var(--wp--style--global--content-size, 760px))) / 2) !important; margin-right: 0 !important; }
/* Sekcje na poziomie strony (home) używają pełnego shella 1180 px jak .section > .shell w Design; typografia zachowuje własne max-width. */
.entry-content > .wp-block-group.m-section > :where(h2, p, .wp-block-buttons, .wp-block-columns, .wp-block-group, figure) { margin-left: calc((100% - min(100%, var(--malarto-max))) / 2) !important; }
.entry-content > .wp-block-group.m-section > :where(.wp-block-buttons, .wp-block-columns, .wp-block-group, figure) { max-width: var(--malarto-max); }
/* Intro strony (okruszki, kicker, H1, lede) jak .page-intro w Design: pełny shell 1180 px do lewej, odstępy 12/24/20 px, lede 52ch (MAL-373). */
/* Specyficzność: reguła wyżej ma :not(.alignwide):not(.alignfull) = (0,3,0), stąd pełne klasy WP w selektorach. */
.entry-content.wp-block-post-content > .m-intro.wp-block-group { max-width: var(--malarto-max); margin-left: calc((100% - min(100%, var(--malarto-max))) / 2) !important; margin-right: 0 !important; padding-bottom: var(--malarto-s6); }
.entry-content.wp-block-post-content > .m-intro.wp-block-group > * { max-width: var(--malarto-max); margin-left: calc((100% - min(100%, var(--malarto-max))) / 2) !important; }
.m-intro.wp-block-group > * + * { margin-block-start: 0; }
.m-intro.wp-block-group > p.m-kicker { margin-bottom: var(--malarto-s3); }
.m-intro.wp-block-group > h1 { margin: 0 0 var(--malarto-s5); }
.m-intro.wp-block-group > p.m-lede { margin-bottom: 20px; }
.entry-content.wp-block-post-content > .m-intro.wp-block-group > h1 { max-width: 16ch; }
.entry-content.wp-block-post-content > .m-intro.wp-block-group > p.m-lede { max-width: 52ch; }
.entry-content.wp-block-post-content > .m-intro.wp-block-group.malarto-term-head > h1.malarto-page-title { max-width: none; }
.entry-content > .m-intro + .malarto-form { margin-top: var(--malarto-s8); }
.malarto-program, .malarto-home-formats, .malarto-home-terms, .malarto-voucher-grid, .malarto-term-layout, .malarto-format-terms, .malarto-format-intro { width: min(100%, var(--malarto-max)); max-width: none; margin-left: calc((100% - min(100%, var(--malarto-max))) / 2); margin-right: 0; }
.entry-content > .m-section.alignfull { width: 100vw; max-width: none; margin-left: calc(50% - 50vw); margin-right: 0; padding-left: var(--malarto-band-pad); padding-right: var(--malarto-band-pad); }
/* Ta sama ochrona dla sekcji zapisanych jako grupa WP (np. FAQ): bywa dzieckiem <main>, nie .entry-content.
   Bez tego treść dotyka krawędzi ekranu, bo alignfull rozciąga sekcję do 100vw. */
main > .wp-block-group.alignfull.m-section,
main > .wp-block-group.alignfull[class*="m-section--"],
.entry-content > .wp-block-group.alignfull.m-section,
.entry-content > .wp-block-group.alignfull[class*="m-section--"] { padding-left: var(--malarto-band-pad); padding-right: var(--malarto-band-pad); }
.m-breadcrumbs { margin-top: 0; }
/* Okruszki z szablonu (post-title) i tytuł szablonu w szerokości shella, 12 px nad kickerem intro jak w Design. */
main.wp-block-group > p.m-breadcrumbs.malarto-breadcrumbs, main.wp-block-group > .wp-block-post-title.alignwide { max-width: var(--malarto-max); margin-left: calc((100% - min(100%, var(--malarto-max))) / 2) !important; margin-right: 0 !important; }
main.wp-block-group > p.m-breadcrumbs.malarto-breadcrumbs { margin-bottom: 0; }
@media (max-width: 639px) { main.wp-block-group.alignfull { padding-left: var(--malarto-band-pad) !important; padding-right: var(--malarto-band-pad) !important; } }
main > .m-breadcrumbs + .entry-content, main > .m-breadcrumbs + .wp-block-post-title { margin-block-start: var(--malarto-s3); }
.m-breadcrumbs a { color: inherit; text-decoration: none; }
.m-breadcrumbs a:hover { color: var(--malarto-glaze-dark); }
p.m-kicker, p.m-label { margin-top: 0; }
/* Jeden token rytmu pionowego: wszystkie pasma (sekcje, grupy m-section, pas filmu) biorą stąd,
   żeby odstępy między sekcjami były równe na każdej szerokości zamiast trzech rozsypanych wartości. */
:root { --malarto-section-pad: clamp(40px, 4.5vw, 64px); }
/* Jedna wysokość i jedna luka dla wszystkich kontrolek nagłówka: pozycje menu, przycisk „Menu”
   i CTA muszą stać w jednej linii, bo różne wysokości (44 vs 40) i luka 8 px wyglądały jak błąd. */
:root { --malarto-header-control: 40px; --malarto-header-gap: 12px; --malarto-header-h: 77px; --malarto-admin-bar: 0px; }
/* Jedna skala szerokości dla całego serwisu. Wcześniej każda sekcja liczyła własną liczbę
   (kontener 1180, treść z edytora 760 wyśrodkowana, pasma z paddingiem gutter/2 = 36 px),
   więc krawędzie nie trzymały się jednej linii i wyglądały losowo.
   --malarto-band-pad: wewnętrzny margines pasma pełnej szerokości, zawsze na linii kontenera.
   --malarto-measure: szerokość akapitu dla czytania; nagłówki zachowują własne miary ch. */
:root { --malarto-band-pad: max(calc(var(--malarto-gutter) / 2), calc((100vw - var(--malarto-max)) / 2)); --malarto-measure: 72ch; }
/* WooCommerce sam ścina kolumnę koszyka i kasy do 1000 px (woocommerce-blocktheme.css). To jego
   ograniczenie, nie nasza szerokość, więc trzymamy je jako osobny token i wyrównujemy do niego
   powiadomienia Woo, zamiast rozciągać je do kontenera. */
:root { --malarto-woo-column: 1000px; }
/* Wysokość paska administratora bierzemy z WordPressa (32 px / 46 px), żeby sticky nagłówek
   i sticky kolumna zakupu nigdy nie chowały się pod belką. */
body.admin-bar { --malarto-admin-bar: var(--wp-admin--admin-bar--height, 32px); }
.malarto-section { margin-block: 0; padding-block: var(--malarto-section-pad); }
.malarto-section__head p { margin-top: 0; }
.malarto-home-terms .malarto-city-filter { margin: 20px 0 0; }
.malarto-home-terms .malarto-city-filter .m-chips { margin-top: 8px; }
.malarto-section__head .m-btn { flex: none; }
/* Nagłówek sekcji łamie się dopiero razem z kitem (poniżej 640 px). Wcześniejszy próg 900 px
   zrzucał przycisk pod tytuł, mimo że w wierszu zostawało jeszcze kilkaset pikseli. */
@media (max-width: 639px) { .malarto-section__head .m-btn { width: 100%; } }
/* Stopka sekcji: jedno wyjście pod listą (Home → Program). Środek na szerokim ekranie,
   pełna szerokość na telefonie — tak jak przycisk w nagłówku sekcji. */
.malarto-section__foot { justify-content: center; margin: 28px 0 0; }
@media (max-width: 639px) { .malarto-section__foot .m-btn { width: 100%; } }

/* ===== Nagłówek ===== */
:root { --malarto-safe-top: env(safe-area-inset-top, 0px); }
.wp-block-template-part:has(> .malarto-header) { position: static; background: var(--malarto-white); }
.malarto-header { position: static; z-index: auto; padding: 0; margin: 0; }
@media (max-width: 782px) {
  body.admin-bar #wpadminbar { position: fixed; top: var(--malarto-safe-top); }
  html:has(body.admin-bar) { margin-top: calc(var(--wp-admin--admin-bar--height, 46px) + var(--malarto-safe-top)) !important; }
}
/* Nagłówek trzyma ten sam margines co treść strony (token --malarto-gutter), więc logo stoi
   dokładnie nad pierwszym elementem sekcji na każdej szerokości. */
/* Jedna luka dla wszystkich kontrolek nagłówka. Kontener nadawał 24 px z blockGap, a owiniecie CTA
   dokładało jeszcze 12 px marginesu, więc realny odstęp wynosił 36 px zamiast tokenu 12 px. */
.malarto-header .malarto-header__inner { width: min(calc(100% - var(--malarto-gutter)), var(--malarto-max)); margin-inline: auto; gap: var(--malarto-header-gap); }
.malarto-header .wp-block-site-logo { margin: 0; flex: none; }
.malarto-header .wp-block-site-logo a, .malarto-header .wp-block-site-logo img { display: block; width: 136px; height: 50px; object-fit: cover; object-position: center; }
.malarto-header .wp-block-navigation { margin-left: auto; }
.malarto-header .wp-block-navigation__container { gap: 2px; }
.malarto-header .wp-block-navigation .wp-block-navigation-item__content { display: inline-flex; align-items: center; box-sizing: border-box; height: var(--malarto-header-control); min-height: var(--malarto-header-control); padding: 8px 12px; border-radius: var(--malarto-radius); font-weight: var(--malarto-weight-bold); text-decoration: none; color: var(--malarto-ink); }
.malarto-header .wp-block-navigation .wp-block-navigation-item__content:hover, .malarto-header .wp-block-navigation .current-menu-item > .wp-block-navigation-item__content { background: var(--malarto-sand); }
/* Longhandy zamiast skrótu "font:" z var() oraz pełny łańcuch przodków: WP nadaje temu
   przyciskowi klasę potrójnie (.wp-block-navigation__responsive-container-open x3 = 0,3,0),
   co nadpisywało font: inherit i "Menu" renderowało się 16 px regular zamiast 14 px bold.
   Ten selektor ma 0,4,0, więc wygrywa, i przycisk ma ten sam kształt co CTA. */
.malarto-header .m-nav .wp-block-navigation .wp-block-navigation__responsive-container-open { display: inline-flex; align-items: center; gap: var(--malarto-s2); box-sizing: border-box; height: var(--malarto-header-control); min-height: var(--malarto-header-control); padding: 8px 13px; border: 1px solid var(--malarto-line); border-radius: var(--malarto-radius); background: var(--malarto-white); color: var(--malarto-ink); font-family: var(--malarto-font-sans); font-size: var(--malarto-size-sm); font-weight: var(--malarto-weight-bold); line-height: 1.2; }
.malarto-header .wp-block-navigation__responsive-container-open::after { content: "Menu"; display: inline-block; max-width: 42px; overflow: hidden; white-space: nowrap; transition: max-width var(--malarto-motion-base) var(--malarto-motion-ease), opacity var(--malarto-motion-fast) var(--malarto-motion-ease); }
/* Ikona jak w .m-nav__toggle z design systemu: 20 px i kreska 2 px. Domyślna ikona WP miała
   24 px i kreskę 1 px, więc hamburger był o połowę lżejszy od reszty kontrolek. */
.malarto-header .m-nav .wp-block-navigation .wp-block-navigation__responsive-container-open svg { width: 20px; height: 20px; stroke-width: 2; }

/* Poniżej 900 px menu jest przyciskiem; od 900 px pokazują się linki i przełącznik znika.
   Ta reguła musi mieć wyższą specyficzność (0,5,0) niż reguła kształtu (0,4,0): inaczej
   `display: inline-flex` z tamtej wygrywało, przełącznik zostawał widoczny obok linków
   na desktopie i nagłówek łamał się do dwóch wierszy (77 px → 103 px). */
@media (min-width: 900px) { .malarto-header .m-nav .wp-block-navigation .wp-block-navigation__responsive-container-open:not(.always-shown) { display: none; } }
@media (min-width: 600px) and (max-width: 899px) {
  .malarto-header .wp-block-navigation__responsive-container:not(.is-menu-open) { display: none !important; }
}
/* ===== Płynna zamiana na progu 900 px ===== */
/* Media query przełącza wiersz linków i przycisk „Menu” skokowo. Animujemy wyłącznie WEJŚCIE:
   180 ms z tokenu --malarto-motion-fast, sama przezroczystość i 4 px uniesienia. Wyjścia nie
   animujemy, bo animowanie `display` (allow-discrete) trzymało odchodzący element w przepływie
   razem z wchodzącym — oba stały w wierszu naraz, nagłówek łamał się do dwóch wierszy i klatki
   skakały. Tak w każdej chwili animuje się jeden element, a opacity/transform nie przeliczają
   układu, więc wysokość nagłówka zostaje 76/77 px. W przeglądarkach bez @starting-style oba
   elementy po prostu się przełączą, jak wcześniej. */
.malarto-header .wp-block-navigation__responsive-container:not(.is-menu-open) {
  transition: opacity var(--malarto-motion-fast) var(--malarto-motion-ease),
              transform var(--malarto-motion-fast) var(--malarto-motion-ease);
}
/* Próg 480 px (telefon ↔ mały telefon): logo zmieniało 136×50 → 118×42, a przycisk „Menu”
   chował etykietę i skakał 94 → 48 px — wszystko w jednej klatce. Te same właściwości i ten sam
   token co .m-fluid w design systemie, więc układ dojeżdża zamiast skakać. */
.malarto-header .m-nav .wp-block-navigation .wp-block-navigation__responsive-container-open,
.malarto-header .wp-block-site-logo a,
.malarto-header .wp-block-site-logo img {
  transition: opacity var(--malarto-motion-fast) var(--malarto-motion-ease),
              transform var(--malarto-motion-fast) var(--malarto-motion-ease),
              width var(--malarto-motion-base) var(--malarto-motion-ease),
              height var(--malarto-motion-base) var(--malarto-motion-ease),
              padding var(--malarto-motion-base) var(--malarto-motion-ease),
              gap var(--malarto-motion-base) var(--malarto-motion-ease);
}
@starting-style {
  .malarto-header .wp-block-navigation__responsive-container:not(.is-menu-open) { opacity: 0; transform: translateY(4px); }
  .malarto-header .m-nav .wp-block-navigation .wp-block-navigation__responsive-container-open { opacity: 0; transform: translateY(-4px); }
}
@media (prefers-reduced-motion: reduce) {
  .malarto-header .wp-block-navigation__responsive-container:not(.is-menu-open),
  .malarto-header .wp-block-navigation__responsive-container-open::after,
  .malarto-header .m-nav .wp-block-navigation .wp-block-navigation__responsive-container-open,
  .malarto-header .wp-block-site-logo a,
  .malarto-header .wp-block-site-logo img { transition: none; }
}
.malarto-header .wp-block-navigation__responsive-container-close { color: var(--malarto-ink); }
.malarto-header .wp-block-navigation__responsive-container.is-menu-open { background: var(--malarto-white); padding: var(--malarto-s5); }
.malarto-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { display: block; padding: 14px 12px; font-size: 18px; }
.malarto-header .malarto-header__cta.wp-block-buttons { margin: 0; flex: none; }
.malarto-header .malarto-header__cta .wp-block-button__link { box-sizing: border-box; height: var(--malarto-header-control); min-height: var(--malarto-header-control); padding: 8px 13px; border-radius: var(--malarto-radius); font-size: var(--malarto-size-sm); font-weight: var(--malarto-weight-bold); }
/* CTA zostaje na każdej szerokości: chowanie go poniżej 640 px zostawiało sam przycisk „Menu”
   i wielką pustkę w połowie nagłówka. Na najwęższych ekranach „Menu” jest ikoną, żeby logo,
   przycisk i CTA mieściły się w jednej linii bez wychodzenia poza ekran. */
@media (max-width: 479px) {
  /* Etykieta zwija się, zamiast zniknąć w jednej klatce: „Menu” zajmuje 38 px, więc sam
     przycisk skakał 94 → 48 px. Pełny łańcuch przodków, bo reguła kształtu ma 0,4,0. */
  .malarto-header .m-nav .wp-block-navigation .wp-block-navigation__responsive-container-open { gap: 0; }
  .malarto-header .wp-block-navigation__responsive-container-open::after { max-width: 0; opacity: 0; }
  .malarto-header .wp-block-site-logo a, .malarto-header .wp-block-site-logo img { width: 118px; height: 42px; }
}

/* ===== Stopka ===== */
.malarto-footer { padding-right: max(var(--malarto-s4), env(safe-area-inset-right, 0px)); padding-bottom: calc(28px + env(safe-area-inset-bottom, 0px)); padding-left: max(var(--malarto-s4), env(safe-area-inset-left, 0px)); margin-top: 0; }
.malarto-footer .malarto-footer__inner { width: min(100%, var(--malarto-max)); margin-inline: auto; }
.malarto-footer .malarto-footer__logo { display: block; width: 160px; height: 60px; margin-bottom: 14px; object-fit: cover; object-position: center; filter: brightness(0) invert(1); }
.malarto-footer p { max-width: 34ch; color: var(--malarto-line); margin: 0 0 12px; }
.malarto-footer .wp-block-navigation { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }
.malarto-footer .wp-block-navigation .wp-block-navigation-item__content { display: inline-flex; align-items: center; min-height: 40px; color: #fff; font-size: var(--malarto-size-sm); font-weight: var(--malarto-weight-bold); text-decoration: underline; text-underline-offset: 3px; padding: 8px 13px; }
.malarto-footer .wp-block-navigation .wp-block-navigation-item__content:hover { color: var(--malarto-sun); }
.malarto-footer .malarto-footer__social { display: flex; gap: 10px; margin-top: 18px; }
.malarto-footer .malarto-footer__meta p { color: inherit; margin: 0; max-width: none; }
@media (max-width: 899px) { .malarto-footer .m-footer__grid { gap: var(--malarto-s6); } }
@media (max-width: 639px) { .malarto-footer .malarto-footer__meta, .malarto-footer .m-footer__meta { align-items: flex-start; } }

/* ===== Hero (blok malarto/hero) ===== */
.malarto-hero-block { min-height: min(clamp(520px, 58vw, 640px), 82vh); padding: clamp(44px, 5vw, 72px) var(--malarto-band-pad); width: 100vw; max-width: none; margin: 0 0 0 calc(50% - 50vw); }
.malarto-hero-block__video { position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%; object-fit: cover; }
.malarto-hero-block__inner { position: relative; z-index: 2; width: min(100%, var(--malarto-max)); margin-inline: auto; }
.malarto-hero-block .m-hero__copy * { color: #fff; }
.malarto-hero-block .m-hero__copy .m-kicker { color: var(--malarto-sun); }
.malarto-hero-block h1 { font: var(--malarto-weight-heavy) var(--malarto-size-h1)/1.02 var(--malarto-font-sans); letter-spacing: var(--malarto-tracking-tight); margin: 0 0 var(--malarto-s5); max-width: 16ch; }
.malarto-hero-block .m-lede { margin-bottom: var(--malarto-s5); }
@media (min-width: 900px) { .malarto-hero-block__inner { padding-left: 48px; } }
@media (max-width: 899px) { .malarto-hero-block__inner { width: 100%; } }

/* ===== Sekcje ze wzorców bloków ===== */
.wp-block-group.m-section { padding-top: var(--malarto-section-pad); padding-bottom: var(--malarto-section-pad); margin-top: 0; margin-bottom: 0; }
.wp-block-group.m-section h2 { margin-bottom: var(--malarto-s4); }
.wp-block-group.m-section--honey { background: var(--malarto-honey); }
.wp-block-group.m-section--wash { background: var(--malarto-wash); }
.wp-block-group.m-section--white { background: var(--malarto-white); border-block: 1px solid var(--malarto-line); }
.wp-block-group.m-section--dark { background: var(--malarto-ink); color: #fff; }
.wp-block-group.m-section--dark h2, .wp-block-group.m-section--dark p { color: #fff; }
@media (max-width: 639px) { .wp-block-group.m-section { padding-top: var(--malarto-section-pad); padding-bottom: var(--malarto-section-pad); } }
/* Dla kogo */
.malarto-audience__layout { gap: var(--malarto-s7); align-items: end; }
.malarto-audience__layout .wp-block-image img { display: block; width: 100%; aspect-ratio: 16/9; object-fit: cover; border-radius: var(--malarto-radius-lg); }
.malarto-audience__signals { margin-top: var(--malarto-s5); gap: 10px; }
.malarto-audience__signals .wp-block-column { padding: 14px 0; border-top: 2px solid var(--malarto-ink); }
.malarto-audience__signals p { margin: 0; }
.malarto-audience__cards { gap: 18px; margin-top: var(--malarto-s5); }
.malarto-audience__cards .wp-block-column { padding: 20px; border: 1px solid var(--malarto-line); border-radius: var(--malarto-radius); background: var(--malarto-white); box-shadow: var(--malarto-shadow-card); }
.malarto-audience__cards .wp-block-column > .wp-block-image { margin: -20px -20px 16px; }
.malarto-audience__cards .wp-block-column > .wp-block-image img { display: block; width: 100%; aspect-ratio: 4/3; object-fit: cover; border-radius: var(--malarto-radius) var(--malarto-radius) 0 0; }
.malarto-audience__cards h3 { margin: 0 0 10px; }
.malarto-audience__cards p { margin: 0; font-size: var(--malarto-size-sm); }
.malarto-audience__cards p + p { margin-top: 10px; }
/* Dlaczego warto */
.malarto-proof-grid { display: grid; grid-template-columns: 1.2fr .8fr .8fr; gap: 8px; margin-top: var(--malarto-s5); }
.malarto-proof-grid img { display: block; width: 100%; height: 360px; object-fit: cover; border-radius: var(--malarto-radius-nested); }
.malarto-proof-grid figure { margin: 0; }
@media (max-width: 1119px) { .malarto-proof-grid { grid-template-columns: 1fr 1fr; } .malarto-proof-grid figure:first-child { grid-column: 1 / -1; } }
@media (max-width: 639px) { .malarto-proof-grid { grid-template-columns: 1fr; } .malarto-proof-grid figure:first-child { grid-column: auto; } .malarto-proof-grid img { height: auto; aspect-ratio: 4/3; } }
/* W cenie */
/* align-items: start — karta ma wysokość swojej treści, a nie najwyższej kolumny w rzędzie. */
.malarto-inclusions__grid { gap: 18px; margin-top: var(--malarto-s5); align-items: start; }
.malarto-inclusions__grid .wp-block-column { padding: var(--malarto-s5); border: 1px solid var(--malarto-line); border-radius: var(--malarto-radius-lg); background: var(--malarto-paper); }
.malarto-inclusions__grid h3 { margin: 0 0 12px; }
.malarto-inclusions__grid .wp-block-buttons { margin-top: var(--malarto-s4); }
/* FAQ: kit styluje details; blok WP dodaje tylko własny margines */
.m-faq .wp-block-details { margin: 0; }
/* Promocja voucherów na home: jasna sekcja jak w Design (kicker glaze, lede wyciszony, przycisk primary) */
.wp-block-group.malarto-voucher-promo { padding-top: 58px; padding-bottom: 68px; }
.malarto-voucher-promo .m-lede { max-width: 38ch; color: var(--malarto-muted); }
.malarto-voucher-promo__layout { gap: var(--malarto-s7); align-items: end; }
/* Voucher w kolumnie Terminu: sam tekst z linkiem „Kup teraz” w kolorze akcentu (makieta 2026-09-25). */
.malarto-voucher-promo--inline .m-lede { margin-bottom: 0; }
.malarto-voucher-promo__link { color: var(--malarto-glaze-dark); font-weight: var(--malarto-weight-bold); text-underline-offset: 3px; white-space: nowrap; }
.malarto-voucher-promo__link:hover { color: var(--malarto-ink); }
/* Teaser miasta */
.malarto-city-teaser { padding: var(--malarto-s5); margin-top: var(--malarto-s7); border-radius: var(--malarto-radius-lg); }
.malarto-city-teaser h2 { margin: 8px 0 10px; font-size: 22px; }
.malarto-city-teaser .wp-block-button__link { border-radius: var(--malarto-radius-nested); }

/* ===== Pieczątka i karty vouchera ===== */
/* Wyjątek od tokenów: gradient pieczątki z Malarto Design (#f5b321 → #f36a34, ramka #71675c). */
.malarto-voucher-stamp { display: grid; gap: 10px; max-width: 320px; margin-inline: auto; padding: 28px; border: 1px solid #71675c; border-radius: var(--malarto-radius-lg); background: linear-gradient(135deg, #f5b321, #f36a34); color: var(--malarto-ink); text-align: left; transform: rotate(-2deg); }
.malarto-voucher-stamp > * { margin: 0; }
.malarto-voucher-stamp__kicker { font-size: var(--malarto-size-sm); font-weight: var(--malarto-weight-heavy); letter-spacing: var(--malarto-tracking-caps); text-transform: uppercase; }
.malarto-voucher-stamp__value { font: var(--malarto-weight-heavy) clamp(38px, 4.2vw, 56px)/.9 var(--malarto-font-sans); letter-spacing: -0.02em; white-space: nowrap; }
.malarto-voucher-stamp__value del { display: none; }
.malarto-voucher-stamp__note { font-size: var(--malarto-size-md); font-weight: var(--malarto-weight-heavy); }
.malarto-voucher-stamp--card { max-width: none; min-height: 112px; margin: 0; padding: 18px 20px; gap: 7px; border-radius: var(--malarto-radius-nested); transform: none; }
.malarto-voucher-stamp--card .malarto-voucher-stamp__value { font-size: clamp(26px, 2.4vw, 36px); }
.malarto-voucher-stamp--card .malarto-voucher-stamp__note { font-size: 13px; }
.malarto-voucher-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--malarto-s4); margin-top: var(--malarto-s6); margin-bottom: var(--malarto-s6); }
.malarto-voucher-card { display: flex; flex-direction: column; min-height: 270px; padding: 12px 12px 20px; border-radius: var(--malarto-radius-lg); box-shadow: none; }
.malarto-voucher-card > .m-kicker, .malarto-voucher-card > p, .malarto-voucher-card > form { margin-left: 12px; margin-right: 12px; }
.malarto-voucher-card > .m-kicker { margin-top: 18px; margin-bottom: 8px; color: var(--malarto-glaze-dark); }
.malarto-voucher-card p { margin-bottom: 12px; font-size: var(--malarto-size-sm); }
.malarto-voucher-card form { margin-top: auto; }
.malarto-voucher-rule { max-width: var(--wp--style--global--content-size, 760px); }
.malarto-voucher-rule h2 { margin: 0 0 8px; }
.malarto-voucher-rule p { margin: 0 0 8px; }
@media (max-width: 899px) { .malarto-voucher-grid { grid-template-columns: 1fr; } }

/* ===== Program ===== */
/* Program: po intro stoją od razu karty Formatów (picker miasta żyje niżej, przy terminach),
   więc przerwa po leadzie nie ma czego wypełniać. Padding intro (32 px) sumował się tam
   z luką bloków WP na .malarto-program (22,4 px) i pierwsze zdjęcie lądowało 74 px pod leadem.
   Zostaje jeden odstęp z intro: 24 px na szerokim ekranie, 12 px na telefonie — tam przerwa
   była najbardziej widoczna, bo zajmowała pół ekranu przed pierwszym zdjęciem.
   Pełne klasy WP w selektorze intro są konieczne: reguła intro wyżej ma (0,4,0), więc krótszy
   selektor przegrywał i padding zostawał na 32 px. */
.entry-content > .malarto-program { margin-block-start: 0; }
.entry-content.wp-block-post-content > .m-intro.wp-block-group:has(+ .malarto-program) { padding-bottom: var(--malarto-s5); }
@media (max-width: 639px) { .entry-content.wp-block-post-content > .m-intro.wp-block-group:has(+ .malarto-program) { padding-bottom: var(--malarto-s3); } }
.malarto-program { padding: 0; }
.malarto-format-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.malarto-format-cards--program { margin: 0 0 var(--malarto-s6); }
/* Filtr miasta bez ramki (2026-09-25): „Miasto” i „Format” to dwie równe grupy chipów pod tytułem. */
.malarto-program-place-picker { margin: 0 0 18px; }
.malarto-program__filters-label { display: block; margin: 0 0 8px; color: var(--malarto-muted); font-size: 13px; font-weight: var(--malarto-weight-heavy); }
.malarto-format-links { margin: 0 0 28px; padding: 0; list-style: none; }
/* Chip jako odnośnik (filtr Programu w adresie): wygląd przycisku-chipa kitu, bez podkreślenia linku. */
a.m-chip, a.m-chip:hover { text-decoration: none; }
@media (prefers-reduced-motion: reduce) { .wp-block-button__link { transform: none !important; } }
/* KF-007: ciaśniejsze filtry wyłącznie w Programie; na telefonie zachowujemy pole dotyku. */
@media (min-width: 640px) {
  .malarto-program .m-chip { min-height: 36px; padding: 5px 12px; }
}
@media (max-width: 639px) {
  .malarto-program .m-chip { min-height: 44px; }
}
/* Format: mniejsza wizualna skala filtra, także dla „Pokaż więcej”. */
.malarto-program .malarto-format-links .m-chip { position: relative; min-height: 36px; padding: 5px 10px; font-size: calc(var(--malarto-size-sm) - 1px); font-weight: var(--malarto-weight-semibold); }
@media (max-width: 639px) {
  /* 36 px chipa + 4 px z każdej strony = 44 px pola dotyku; odstęp wierszy to 8 px. */
  .malarto-program .malarto-format-links .m-chip::before { content: ""; position: absolute; inset: -5px -1px; }
}
.malarto-pagination { margin-top: var(--malarto-s5); display: flex; flex-wrap: wrap; gap: 20px; align-items: center; font-weight: var(--malarto-weight-bold); }
.malarto-empty { display: grid; gap: 6px; }
.malarto-filter-empty { display: grid; gap: 10px; justify-items: start; }
.malarto-filter-empty[hidden] { display: none; }
.malarto-filter-empty p { margin: 0; }
.malarto-experiment-note { padding: var(--malarto-s4); border: 0; border-radius: var(--malarto-radius-sm); background: var(--malarto-cream); }
.malarto-city-filter { margin: 0 0 18px; }

/* ===== Karta Formatu (home i Program) ===== */
.malarto-format-card { position: relative; min-width: 0; }
.malarto-format-card > .malarto-hero-wrap.m-card__photo { width: calc(100% + 40px); margin: -20px -20px 18px; overflow: hidden; }
.malarto-format-card .m-card__photo > img { display: block; width: 100%; height: 100%; aspect-ratio: auto; object-fit: cover; border-radius: 0; }
/* Specyficzność: kit ma .m-card > .m-card__strip:last-child (0,3,0). */
.m-card.malarto-format-card--home .m-card__strip { grid-template-columns: 1fr; }
.m-card.malarto-format-card--home .m-card__strip .m-btn { width: 100%; justify-content: center; }
/* Dwie akcje karty Formatu: „Więcej” (drugi plan) i „Program formatu” (primary) w jednym rzędzie;
   przy wąskiej karcie przechodzą jedna pod drugą, zamiast ściskać tekst. */
.malarto-format-card__actions { display: grid; grid-template-columns: repeat(auto-fit, minmax(128px, 1fr)); gap: var(--malarto-s2); margin-top: auto; }
.malarto-format-card__actions .m-btn { width: 100%; justify-content: center; white-space: nowrap; }
.malarto-format-card h3 { max-width: none; }
.malarto-format-card h3 a { color: inherit; text-decoration: none; }
.malarto-format-card > p:not(.m-label) { margin: 0 0 18px; }
/* Tekst karty trzyma trzy wiersze (pole ma limit 120 znaków): karty i ich paski stoją równo. */
.malarto-format-card > p:not(.m-label) { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; min-height: 3lh; overflow: hidden; }
/* Home: pełny opis również na wąskiej karcie. Pas rozciąga karty do wspólnej wysokości. */
.malarto-format-card--home > p:not(.m-label) { display: block; -webkit-line-clamp: unset; overflow: visible; }
.malarto-format-card__strip { border-radius: 0 0 var(--malarto-radius) var(--malarto-radius); }
.malarto-format-card__strip strong { display: block; }
.malarto-format-card__cta { width: 100%; margin-top: auto; }
/* Filtr Programu przeładowuje stronę pod #terminy; nagłówek nie może zasłonić początku listy. */
.malarto-program #terminy { scroll-margin-top: calc(var(--malarto-header-h, 80px) + 16px); }
/* Przełączenie filtra Programu (kit-enhance.js, View Transitions): lista przenika się krótko, bez skoku. */
.malarto-program { view-transition-name: malarto-program; }
::view-transition-old(malarto-program), ::view-transition-new(malarto-program) { animation-duration: .22s; animation-timing-function: ease; }
/* Poniżej 640 px karty Formatów tworzą pas przewijany w poziomie. Pas z overflow-x: auto
   dostaje też overflow-y: auto, więc obcina pion: cień karty (0 8px 28px) sięga 6 px nad
   i 22 px pod krawędź, a obwódka skupienia 4 px poza nią. Padding pasa musi to pomieścić,
   inaczej cień urywa się linią na krawędzi pasa.
   Pas nie deklaruje touch-action. `pan-x` wyłączał pion: przeglądarka nie przewija w osi,
   której touch-action nie wymienia, a gest nad pasem trafia w pas, nie w stronę — pas
   zajmuje prawie cały ekran telefonu, więc strona wyglądała na zablokowaną i trzeba było
   chwycić palcem poza kartami. Osie rozdziela sam gest: natywne overflow-x przewija taśmę,
   pion zostaje stronie (tak samo jak w makiecie bez touch-action). */
/* Karuzela kart Formatów na Home na każdej szerokości (2026-09-25): pas przewijany gestem jak na
   telefonie; od 640 px trzy karty w kadrze i widoczne strzałki lewo/prawo (atom .m-media__arrow kitu).
   Strzałki pokazuje kit-enhance.js tylko przy nadmiarze kart; na krańcach są nieaktywne. */
.malarto-format-rail { position: relative; }
.malarto-home-formats .malarto-format-cards { display: flex; gap: 20px; margin-inline: calc(-1 * var(--malarto-s4)); padding: 8px var(--malarto-s4) 24px; overflow-x: auto; scrollbar-width: none; overscroll-behavior-inline: contain; user-select: none; }
.malarto-home-formats .malarto-format-cards::-webkit-scrollbar { display: none; }
.malarto-home-formats .malarto-format-cards img { -webkit-user-drag: none; }
/* Stała szerokość karty zamiast dzielenia pasa na trzy: przy przewijaniu nie ma po co ściskać kart. */
.malarto-home-formats .malarto-format-cards > * { flex: 0 0 min(400px, 86%); }
/* Przeciąganie wiąże MalartoUI.bindStrip (kit-enhance.js); kursor pokazuje, że pas jedzie. */
.malarto-home-formats .malarto-format-cards.is-overflow,
.malarto-home-formats .malarto-format-cards.is-overflow > * { cursor: grab; }
.malarto-home-formats .malarto-format-cards.is-dragging,
.malarto-home-formats .malarto-format-cards.is-dragging > * { cursor: grabbing; }
.malarto-home-formats .malarto-format-cards.is-dragging { scroll-behavior: auto; }
/* Strzałki na środku wysokości kart: pas ma 8 px nad kartami i 24 px pod nimi (miejsce na cień). */
.malarto-format-rail__controls { display: flex; gap: var(--malarto-s2); flex: 0 0 auto; }
.malarto-home-formats .m-section__head { flex-direction: row; align-items: flex-start; flex-wrap: nowrap; gap: var(--malarto-s3); }
.malarto-home-formats .m-section__head > div:first-child { min-width: 0; flex: 1; }
.malarto-format-rail__arrow { position: static; transform: none; width: 44px; height: 44px; background: var(--malarto-white); color: var(--malarto-ink); border: 1px solid var(--malarto-line); }
.malarto-format-rail__arrow:disabled { opacity: .4; cursor: default; }
/* Kontrole w nagłówku nie mają przesunięcia -50% właściwego strzałkom na zdjęciu. */
.malarto-home-formats .malarto-format-rail__arrow,
.malarto-home-formats .malarto-format-rail__arrow:hover,
.malarto-home-formats .malarto-format-rail__arrow:active { transform: none !important; transition: none; }
.malarto-format-rail__arrow.m-media__arrow--prev { left: 12px; } .malarto-format-rail__arrow.m-media__arrow--next { right: 12px; }
/* Równe karty na Home: tytuł zajmuje zawsze dwa wiersze, a pasek z terminem dwa wiersze tam, gdzie
   „Najbliżej: … od … zł” może się złamać — tekst, pasek i przyciski stoją wtedy w jednej linii. */
.malarto-format-card--home h3 { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
@media (max-width: 639px) {
  .malarto-format-card--home h3 { min-height: 2lh; }
  .malarto-format-card--home .malarto-format-card__strip strong { min-height: 2lh; }
}
@media (min-width: 640px) {
  .malarto-home-formats .malarto-format-rail__arrow:not([hidden]) { display: grid !important; }
}
@media (max-width: 639px) {
  .malarto-home-formats .malarto-format-rail__controls { display: none; }
}
.malarto-format-rail__arrow[hidden] { display: none; }
@media (max-width: 639px) {
  .malarto-format-cards { grid-template-columns: 1fr; }
  .malarto-home-formats .malarto-format-cards { gap: 14px; }
  .malarto-home-formats .malarto-format-cards > * { scroll-snap-align: center; }
  /* Telefon: przesunięcie palcem, bez strzałek (ta sama zasada co galeria kitu). */
  .malarto-format-rail__arrow { width: 40px; height: 40px; }
}
/* Przyciąganie tylko dla palca: przy przeciąganiu myszą (mBindStrip ustawia scrollLeft)
   wymuszone przyciąganie walczyłoby z gestem. Ta sama zasada co w .m-media__thumbs kitu. */
@media (max-width: 639px) and (pointer: coarse) { .malarto-home-formats .malarto-format-cards { scroll-snap-type: x proximity; } }

/* ===== Wiersz Terminu (kit .m-row / .m-list): tu tylko szczegóły daty i podpisu ===== */
.m-row > .m-row__thumb.malarto-hero-wrap { margin: 0; } /* figure z globalnych stylów miał 24px pod spodem i przesuwał datę poniżej środka miniatury */
/* Tytuł karty nie dziedziczy wąskiego 22ch nagłówków sekcji. */
.m-row__body .m-h3 { max-width: 80%; text-wrap: wrap; }
@container (max-width: 700px) { .m-row__body .m-h3 { max-width: 100%; } }
.malarto-term-card__date--tba { font: var(--malarto-weight-bold) var(--malarto-size-sm) var(--malarto-font-sans); color: var(--malarto-muted); white-space: normal; }
.malarto-term-card__when strong { display: none; }
/* Linia miejsca: lokal · miasto na każdej szerokości (Tomasz, 2026-09-25) — miasto na plakietce
   kadru nie wystarczało, bo w tekście wiersza czytało się tylko nazwę lokalu. */
.malarto-term-card__when span { color: var(--malarto-muted); font-size: var(--malarto-size-xs); }
/* Prawa kolumna kafla niesie już tylko cenę; stan miejsc zszedł na kadr (kit: .m-row__state). */
.malarto-term-card__offer { margin: 0; }
.malarto-term-card__cta { text-decoration: none; }
.malarto-term-card__price { font: var(--malarto-weight-heavy) 18px/1.2 var(--malarto-font-sans); white-space: nowrap; }
.malarto-term-card__price del { margin-right: 6px; color: var(--malarto-muted); font-weight: var(--malarto-weight-body); font-size: var(--malarto-size-sm); }
.malarto-term-card__price ins { text-decoration: none; }
.malarto-term-card__cta::after { content: " →"; }
.malarto-term-card__cta:focus-visible { outline: 2px solid var(--malarto-glaze); outline-offset: 2px; }
.m-row[hidden] { display: none; }
@media (max-width: 767px) { .m-row .malarto-term-card__date--tba { font-size: var(--malarto-size-sm); } }

/* ===== Format (strona pojedyncza) ===== */
.malarto-format-kicker { margin-bottom: var(--malarto-s2); }
.malarto-format-intro { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--malarto-s5); margin-top: var(--malarto-s4); margin-bottom: var(--malarto-s6); }
.malarto-format-intro .malarto-hero-wrap { margin: 0; }
.malarto-format-intro .malarto-hero { display: block; width: 100%; aspect-ratio: 4/3; max-height: none; object-fit: cover; border-radius: var(--malarto-radius-lg); }
.malarto-format-intro .malarto-gallery { margin: 0; }
.malarto-format-intro .malarto-gallery h2 { display: none; }
.malarto-format-intro:has(.m-media) .malarto-hero-wrap { display: none; }
.malarto-format-terms .malarto-split { display: grid; grid-template-columns: 1.25fr .75fr; gap: 28px; align-items: start; }
@media (max-width: 899px) { .malarto-format-terms .malarto-split { grid-template-columns: 1fr; } }
/* Lewa kolumna to jedno miejsce: lista terminów i galerie spoza nagłówka („Inspiracje", katalogi).
   Ta sama szerokość co kafle terminów, a szyna miejsca zostaje obok jako element sticky. */
.malarto-split__main { grid-column: 1; min-width: 0; }
.malarto-split__main > .malarto-gallery { margin-block: 0; padding-block: 0; }
.malarto-split__main > .m-list + .malarto-gallery,
.malarto-split__main > .m-notice + .malarto-gallery { margin-top: var(--malarto-s6); }
.malarto-split__main > .malarto-gallery + .malarto-gallery { margin-top: var(--malarto-s5); }
.malarto-split__main > .malarto-gallery > h2 { margin-top: 0; }
.malarto-venue-rail { position: sticky; top: 92px; }
.malarto-venue-rail > .m-kicker { margin-bottom: var(--malarto-s3); }
.malarto-venue-rail .malarto-place { margin: 0; }
.malarto-video { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: var(--malarto-s6); align-items: center; padding: var(--malarto-s6); border-radius: var(--malarto-radius-lg); background: var(--malarto-wash); }
.malarto-video h2 { margin: 0 0 var(--malarto-s3); }
.malarto-video > p { margin: 0 0 var(--malarto-s3); }
.malarto-video-frame { grid-column: 2; grid-row: 1 / span 4; margin: 0; border-radius: var(--malarto-radius-nested); overflow: hidden; background: var(--malarto-ink); }
.malarto-video-frame iframe { display: block; width: 100%; aspect-ratio: 16/9; border: 0; }
.malarto-video-privacy { font-size: var(--malarto-size-xs); color: var(--malarto-muted); }
@media (max-width: 899px) { .malarto-video { grid-template-columns: 1fr; } .malarto-video-frame { grid-column: 1; grid-row: auto; } }
.malarto-gallery-track { display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; padding-bottom: 4px; }
.malarto-gallery-track::-webkit-scrollbar { display: none; }
.malarto-gallery-track a { flex: 0 0 clamp(88px, 12vw, 112px); border: 2px solid transparent; border-radius: 10px; overflow: hidden; }
.malarto-gallery-track img { display: block; width: 100%; aspect-ratio: 1; object-fit: cover; }
.malarto-gallery-controls { display: none; }
.malarto-gallery .m-media { max-width: 100%; }
.malarto-photo-dialog { border: 0; border-radius: 0; background: #1f1a17; }
.malarto-photo-dialog::backdrop { background: #1f1a17; }
.malarto-photo-dialog button { display: grid; width: 42px; height: 42px; padding: 0; place-items: center; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .92); color: var(--malarto-ink); cursor: pointer; }

/* ===== Termin (strona pojedyncza) ===== */
/* Treść z edytora (Format, oferta) trzyma jedną linię startu z resztą strony: szerokość kontenera
   zamiast 760 px wyśrodkowanych na środku ekranu, a akapit ogranicza miarę do czytania. */
.malarto-format-body { width: min(100%, var(--malarto-max)); max-width: none; margin-left: calc((100% - min(100%, var(--malarto-max))) / 2) !important; margin-right: 0 !important; }
.malarto-format-body > p, .malarto-format-body > ul, .malarto-format-body > ol { max-width: var(--malarto-measure); }
.malarto-format-body > h2 { max-width: var(--malarto-heading-measure); }
.malarto-format-body > h3 { max-width: 32ch; }
.malarto-term-layout { display: grid; grid-template-columns: minmax(0, 1fr) 440px; gap: var(--malarto-s5); align-items: start; }
.malarto-term-layout .malarto-term-main { grid-column: 1; min-width: 0; }
.malarto-term-layout .malarto-term-aside { grid-column: 2; grid-row: 1 / span 2; position: static; padding: var(--malarto-s5); border-radius: var(--malarto-radius-lg); }
.malarto-term-booking { grid-column: 2; grid-row: 1 / span 2; min-width: 0; }
/* Wybrany układ: tytuł należy do rezerwacji; karta przewija się razem ze stroną. */
body.single-malarto_termin main.wp-block-group { padding-top: var(--malarto-s5) !important; }
body.single-malarto_termin .malarto-term-aside > h1.malarto-page-title { max-width: none; margin: 0 0 var(--malarto-s4); font-size: 28px !important; line-height: 1.12; }
.malarto-term-main .malarto-hero-wrap { margin: 0 0 var(--malarto-s4); aspect-ratio: 16/9; overflow: hidden; border-radius: var(--malarto-radius-lg); }
.malarto-term-main .malarto-hero { display: block; width: 100%; height: 100%; aspect-ratio: auto; max-height: none; object-fit: cover; border-radius: inherit; }
/* Jedyny link na dole Terminu (makieta 2026-09-25): wyśrodkowany, w kolorze akcentu, nad FAQ. */
.malarto-term-foot { margin: var(--malarto-s6) 0; text-align: center; }
.malarto-term-foot a { color: var(--malarto-glaze-dark); font-size: var(--malarto-size-md); font-weight: var(--malarto-weight-bold); text-underline-offset: 3px; }
.malarto-term-foot a:hover { color: var(--malarto-ink); }
.malarto-term-hook { margin: 0 0 var(--malarto-s5); }
/* KF-014: opis Terminu ma jeden rozmiar tekstu z tokenu treści; nagłówki zachowują skalę. */
.malarto-term-description__body .m-lede { font-size: var(--malarto-size-md); }
/* Wstęp Formatu (FB 21) na Formacie i Terminie: Enter to kolejny akapit z odstępem jak w treści (16 px),
   Shift+Enter to <br> w tym samym akapicie — bez przerwy sekcji między akapitami wstępu. */
.malarto-lede > p { margin: 0 0 var(--malarto-s4); }
.malarto-lede > p:last-child { margin-bottom: 0; }
.malarto-context-links a { color: var(--malarto-ink); font-weight: var(--malarto-weight-bold); text-underline-offset: 3px; }
.malarto-context-links a:hover { color: var(--malarto-glaze-dark); }
/* Kolumna Terminu jest węższa niż pełnoekranowe pasmo Formatu: odstęp między sekcjami bierzemy z marginesu,
   nie z paddingu pasma (2 × 64 px dawało ponad 120 px przerwy). Karta Miejsca odzyskuje własny padding.
   Dolna granica to s6 = 32 px, nie 28 px: rytm ma być uporządkowany — krok w sekcji (20 px w akapicie,
   24 px pod tytułem) < odstęp między sekcjami (32 px), żeby granica sekcji była widoczna na telefonie.
   28 px było też poza skalą (s5 24 / s6 32) i dryfowało do 30,7 px przy 1024 px. */
.malarto-term-main > .malarto-section { padding-block: 0; margin-block: clamp(32px, 3vw, 40px); }
.malarto-term-main > .malarto-place { padding-block: 20px; }
.malarto-term-main .malarto-section:first-child { margin-top: 0; }
.malarto-term-main .m-section.alignfull { width: 100%; max-width: none; margin: var(--malarto-s5) 0; padding: var(--malarto-s5); border-radius: var(--malarto-radius-lg); }
.malarto-term-aside p.malarto-state { margin: 0 0 12px; }
.malarto-term-aside .malarto-facts { margin: 0 0 16px; }
.malarto-term-aside .malarto-facts > div { grid-template-columns: 110px minmax(0, 1fr); gap: 10px; padding: 9px 0; font-size: var(--malarto-size-md); }
.malarto-term-aside .malarto-facts dd del { color: var(--malarto-muted); margin-right: 6px; }
.malarto-term-aside .malarto-facts dd ins { text-decoration: none; font: var(--malarto-weight-heavy) var(--malarto-size-price)/1.1 var(--malarto-font-sans); }
.malarto-term-aside .malarto-purchase { padding: 0; border: 0; background: transparent; display: grid; gap: 10px; }
.malarto-term-aside .malarto-purchase label { display: grid; gap: 6px; font-size: var(--malarto-size-sm); font-weight: var(--malarto-weight-bold); }
.malarto-term-aside .malarto-purchase .m-stepper input, .malarto-term-aside .malarto-purchase > label > input { width: 100%; }
.malarto-term-aside .malarto-purchase button[type="submit"] { width: 100%; }
.malarto-term-aside .malarto-purchase p { margin: 0; font-size: var(--malarto-size-xs); color: var(--malarto-muted); }
.malarto-term-aside .malarto-purchase a { font-size: var(--malarto-size-sm); }
.malarto-term-aside .malarto-purchase-summary { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: var(--malarto-s2); }
.malarto-term-aside .malarto-purchase p.malarto-purchase-total { color: var(--malarto-ink); font-size: var(--malarto-size-sm); }
.malarto-purchase-total strong { margin-left: var(--malarto-s2); font-size: var(--malarto-size-lg); font-weight: var(--malarto-weight-heavy); }
@media (max-width: 899px) { .malarto-term-layout { grid-template-columns: 1fr; } .malarto-term-layout .malarto-term-aside { grid-column: 1; grid-row: auto; position: static; } .malarto-term-layout .malarto-term-main { grid-column: 1; } }
.malarto-place { border-radius: var(--malarto-radius-lg); }
.malarto-place > .m-kicker { margin-bottom: 6px; }
.malarto-place h3 { margin: 0 0 12px; }
.malarto-place .malarto-facts { margin: 0 0 12px; }
.malarto-place .malarto-facts > div { grid-template-columns: 112px minmax(0, 1fr); gap: 14px; padding: 11px 0; }
.malarto-place .malarto-facts dt { font-weight: var(--malarto-weight-heavy); }
.malarto-place-links { display: flex; flex-wrap: wrap; gap: 8px; margin: 10px 0 0; }
.malarto-place .m-hint { margin: 12px 0 0; }
.malarto-page-title { margin: 0 0 var(--malarto-s3); }
body.home .malarto-hero-block { margin-top: 0; }
.malarto-facts { margin: 20px 0; }
.malarto-hero-wrap { margin: 0 0 var(--malarto-s5); }
.malarto-hero { display: block; width: 100%; aspect-ratio: 16/9; max-height: none; object-fit: cover; border-radius: var(--malarto-radius-lg); }

/* ===== Formularze: wtyczka, wzorce, WooCommerce ===== */
/* Jak `.m-form` w design systemie: sama siatka, bez obudowy. Karta wokol formularza byla wariantem, ktorego kit nie zna. */
.malarto-form { display: grid; grid-template-columns: 1fr 1fr; gap: var(--malarto-s4); --malarto-radius-nested: 10px; }
/* Formularz i karta na stronie trzymaja kolumne tekstu i lewa krawedz naglowka; przy szerokosci `--malarto-max` pole "Temat" mialo 1138px. */
/* `!important` jak w regule wyrownania powyzej: uklad constrained WordPressa wymusza `margin: auto` i inaczej centruje oba bloki. */
.entry-content > .malarto-form, .entry-content > .wp-block-group.m-card { max-width: var(--wp--style--global--content-size, 760px); margin-left: 0 !important; margin-right: auto !important; }
.malarto-form .m-checkline { padding-left: 0; font-size: var(--malarto-size-md); font-weight: var(--malarto-weight-body); }
.malarto-form .m-field--full { grid-column: 1 / -1; }
.malarto-form__note { grid-column: 1 / -1; margin: 0; padding: 0; font-size: var(--malarto-size-xs); color: var(--malarto-muted); }
.malarto-form .m-btn { border-radius: var(--malarto-radius-nested); }
.malarto-form__status { margin: 0; }
.malarto-form__status:focus { outline: none; }
.malarto-form__trap { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
@media (max-width: 639px) { .malarto-form { grid-template-columns: 1fr; } }
.malarto-purchase input, .woocommerce input.input-text, .woocommerce select, .woocommerce textarea, .woocommerce .qty, .wc-block-components-text-input input, main input[type="text"], main input[type="email"], main input[type="tel"], main input[type="number"], main input[type="date"], main select, main textarea { height: var(--malarto-control-h); min-height: var(--malarto-control-h); padding: 10px 14px; border: 1px solid var(--malarto-line); border-radius: 10px; background: #fff; color: inherit; font: inherit; line-height: 1.3; }
main textarea, .woocommerce textarea { height: auto; min-height: 90px; }
main select:not(.m-select > select), .woocommerce select { appearance: none; -webkit-appearance: none; padding-right: 42px; background: #fff no-repeat right 14px center / 18px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23302c28' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); }
/* Klikniecie myszka zmienia tylko kolor ramki pola; obwodka skupienia pojawia sie wylacznie przy obsludze klawiatura. */
main input:focus, main select:focus, main textarea:focus, .woocommerce input:focus, .woocommerce select:focus { border-color: var(--malarto-ink); outline: none; }
main input:focus-visible, main select:focus-visible, main textarea:focus-visible, .woocommerce input:focus-visible, .woocommerce select:focus-visible { border-color: var(--malarto-ink); outline: var(--malarto-focus); outline-offset: 2px; }
.woocommerce form .form-row label, main label { font-weight: var(--malarto-weight-bold); font-size: var(--malarto-size-sm); padding-left: 6px; }
/* Woo fields use the shared .m-field control rules; only adapt its row markup here. */
.woocommerce form .form-row:has(> .woocommerce-input-wrapper > :is(input.input-text, select:not([type="hidden"]), textarea)) { display: flex; flex-direction: column; gap: 6px; padding: 0; margin: 0 0 var(--malarto-s4); }
.woocommerce form .form-row > label:not(.checkbox) { margin: 0; line-height: 1.55; }
.woocommerce form .form-row .woocommerce-input-wrapper { display: block; width: 100%; }
.woocommerce form .form-row:has(> .woocommerce-input-wrapper > :is(input.input-text, select, textarea))::before, .woocommerce form .form-row:has(> .woocommerce-input-wrapper > :is(input.input-text, select, textarea))::after { content: none; }
.woocommerce form .form-row:has(> .woocommerce-input-wrapper:only-child > input[type="hidden"]:only-child) { display: none; }
.malarto-purchase { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; padding: 20px; background: var(--malarto-sand); border: 1px solid var(--malarto-line); border-radius: var(--malarto-radius); }
.malarto-purchase input { width: 90px; text-align: center; font-weight: var(--malarto-weight-heavy); }
/* Woo nie nadaje ilosci w koszyku szerokosci, wiec przy naszym paddingu 14px dwucyfrowa liczba byla ucieta. Ta sama szerokosc co w buy boxie.
   Selektor idzie przez `main`, bo klasyczny koszyk w tym motywie bloków nie ma przodka `.woocommerce`. */
/* Woo ma wlasne `.woocommerce .quantity .qty` z wieksza specyficznoscia niz `main input.qty`, wiec pole wracalo do 58px i ucinalo dwucyfrowa liczbe. */
.woocommerce .quantity input.qty, main input.qty { width: 90px; padding-inline: 10px; text-align: center; font-weight: var(--malarto-weight-heavy); }
main .m-stepper input, .woocommerce .m-stepper input.qty { width: 100%; padding: 0; border-radius: 0; border-inline: 0; }
.malarto-term-card .m-btn, .malarto-format-card__strip .m-btn { border-radius: var(--malarto-radius-nested, 6px); }
.malarto-inclusions .wp-block-button__link { border-radius: var(--malarto-radius-nested, 6px); }
.malarto-purchase button[type="submit"], .woocommerce .button, .woocommerce button.button, .woocommerce a.button, .woocommerce #respond input#submit, .wc-block-components-button, .wp-block-button__link { display: inline-flex; align-items: center; justify-content: center; gap: var(--malarto-s2); min-height: var(--malarto-control-h); padding: 10px 18px; border: 1px solid var(--malarto-glaze-dark); border-radius: var(--malarto-radius); background: var(--malarto-glaze-dark); color: #fff; font: var(--malarto-weight-bold) var(--malarto-size-md) var(--malarto-font-sans); line-height: 1.2; text-decoration: none; cursor: pointer; transition: transform .12s ease, box-shadow .16s ease, background-color .16s ease; }
.malarto-purchase button[type="submit"]:hover, .woocommerce .button:hover, .wc-block-components-button:hover, .wp-block-button__link:hover { background: var(--malarto-glaze-dark); border-color: var(--malarto-glaze-dark); transform: translateY(-1px); box-shadow: var(--malarto-shadow-hover); }
.malarto-purchase button[type="submit"]:active, .woocommerce .button:active, .wc-block-components-button:active, .wp-block-button__link:active { transform: translateY(1px) scale(.97); box-shadow: none; }
.malarto-purchase button:disabled, .woocommerce .button:disabled, .woocommerce .button.disabled { opacity: .45; cursor: not-allowed; transform: none; box-shadow: none; }
.is-style-outline .wp-block-button__link, .woocommerce a.button.wc-forward:not(.checkout-button) { background: var(--malarto-white); color: var(--malarto-ink); border-color: var(--malarto-ink); }
.is-style-outline .wp-block-button__link:hover { background: var(--malarto-white); border-color: var(--malarto-ink); }
/* Mapowanie .m-notice na klasyczne i blokowe komunikaty Woo, również poza wrapperem .woocommerce.
   Stany korzystają z teł kitu, bez kolorowych ramek i domyślnego zielonego akcentu Woo. */
.woocommerce .woocommerce-info, .woocommerce .woocommerce-message, .woocommerce .woocommerce-error,
main .woocommerce-info, main .woocommerce-message, main .woocommerce-error,
.wc-block-components-notice-banner, .wc-block-components-notice-banner.is-success,
.wc-block-components-notice-banner.is-info, .wc-block-components-notice-banner.is-warning,
.wc-block-components-notice-banner.is-error { padding: var(--malarto-s4); border: 0; border-radius: var(--malarto-radius-sm); background: var(--malarto-cream); color: var(--malarto-ink); }
.woocommerce .woocommerce-message, main .woocommerce-message, .wc-block-components-notice-banner.is-success { background: var(--malarto-sand); }
.woocommerce .woocommerce-error, main .woocommerce-error, .wc-block-components-notice-banner.is-error { background: var(--malarto-danger-wash); color: var(--malarto-sold-ink); }
.woocommerce .woocommerce-info, main .woocommerce-info, .wc-block-components-notice-banner.is-info { background: var(--malarto-wash); }
.wc-block-components-notice-banner:is(.is-success, .is-error, .is-info, .is-warning) > svg { background: transparent; color: inherit; fill: currentColor; padding: 0; }
main .woocommerce-info::before, main .woocommerce-message::before, main .woocommerce-error::before { display: none; }
.woocommerce table.shop_table { border: 1px solid var(--malarto-line); border-radius: var(--malarto-radius); border-collapse: separate; }
/* WooCommerce ogranicza kolumnę koszyka i kasy do 1000 px, a pas powiadomień bierze szerokość
   kontenera 1180 px — komunikat wystawał 180 px poza tabelę i przycisk „Zobacz koszyk" lądował
   poza kolumną treści. Pas powiadomień stoi teraz na tej samej linii co tabela. */
body:is(.woocommerce-cart, .woocommerce-checkout) main.wp-block-group > :is(.wp-block-post-title.alignwide, p.m-breadcrumbs.malarto-breadcrumbs, .entry-content, .wc-block-store-notices) { width: min(100%, var(--malarto-woo-column)); max-width: var(--malarto-woo-column) !important; margin-left: auto !important; margin-right: auto !important; }
/* „Zobacz koszyk" w pasie Woo jest płynącym linkiem z podkreśleniem; ma być przyciskiem konturowym kitu. */
.woocommerce .wc-block-components-notice-banner .wc-forward { background: var(--malarto-white) !important; color: var(--malarto-ink) !important; border: 1px solid var(--malarto-ink); border-radius: var(--malarto-radius); padding: 10px 18px !important; opacity: 1; text-decoration: none; }
.woocommerce .wc-block-components-notice-banner .wc-forward:hover { background: var(--malarto-sand) !important; text-decoration: none; }
.woocommerce table.shop_table th, .woocommerce table.shop_table td { border-color: var(--malarto-line); }
/* Pusty koszyk: oddech między przyciskiem powrotu do Programu a stopką. */
.woocommerce-cart .return-to-shop { margin-bottom: var(--malarto-s8); }
/* Koszyk: miniatura, tytul i usuwanie zostawaly na domyslnych stylach Woo (ostre rogi, podkreslenie, obcy czerwony). */
.woocommerce td.product-thumbnail img { border-radius: var(--malarto-radius-nested, 8px); object-fit: cover; }
.woocommerce td.product-name a { text-decoration: none; font-weight: var(--malarto-weight-bold); }
.woocommerce td.product-name a:hover { text-decoration: underline; }
/* Woo wymusza kolor `x` przez `!important`, wiec tylko tu odpowiadamy tym samym. */
.woocommerce td.product-remove a.remove, .woocommerce a.remove { color: var(--malarto-danger) !important; }
.woocommerce td.product-remove a.remove:hover, .woocommerce a.remove:hover { background: var(--malarto-danger-wash) !important; color: var(--malarto-danger) !important; }
.woocommerce-checkout #payment { background: var(--malarto-sand); border-radius: var(--malarto-radius); }
/* Jedyna metoda to strona Stripe: lista metod znika (radio zostaje w formularzu i jest zaznaczone), pod przyciskiem
   stoi nota o karcie i BLIK-u oraz oficjalny znak „Powered by Stripe” w oryginalnej postaci. */
.malarto-pay-hosted #payment ul.wc_payment_methods { display: none; }
/* Włączony przelew ręczny może stać obok Stripe. Stan sprawdzamy na body: formularz też ma
   klasę woocommerce-checkout, ale nie ma klasy malarto-pay-hosted. Radio i fragmenty Woo pozostają natywne. */
body.woocommerce-checkout:not(.malarto-pay-hosted) #payment ul.wc_payment_methods { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--malarto-s4); padding: var(--malarto-s5); }
body.woocommerce-checkout:not(.malarto-pay-hosted) #payment ul.wc_payment_methods::before, body.woocommerce-checkout:not(.malarto-pay-hosted) #payment ul.wc_payment_methods::after { display: none; }
body.woocommerce-checkout:not(.malarto-pay-hosted) #payment ul.wc_payment_methods > li { display: grid; grid-template-columns: auto minmax(0, 1fr); align-content: start; align-items: start; gap: var(--malarto-s3); padding: var(--malarto-s5); margin: 0; border: 1px solid var(--malarto-line); border-radius: var(--malarto-radius); background: var(--malarto-paper, #fff); line-height: 1.5; }
body.woocommerce-checkout:not(.malarto-pay-hosted) #payment ul.wc_payment_methods > li:has(> input:checked) { border-color: var(--malarto-ink); background: var(--malarto-sand); }
body.woocommerce-checkout:not(.malarto-pay-hosted) #payment ul.wc_payment_methods > li > input[type="radio"] { grid-column: 1; grid-row: 1; width: auto; min-width: 0; float: none; margin: 4px 0 0; accent-color: var(--malarto-ink); }
body.woocommerce-checkout:not(.malarto-pay-hosted) #payment ul.wc_payment_methods > li > label { grid-column: 2; grid-row: 1; padding: 0; margin: 0; font-size: var(--malarto-size-sm); line-height: 1.5; cursor: pointer; }
body.woocommerce-checkout:not(.malarto-pay-hosted) #payment div.payment_box { grid-column: 1 / -1; width: auto; margin: 0; padding: var(--malarto-s3) 0 0; border-top: 1px solid var(--malarto-line); background: transparent; color: inherit; font-size: var(--malarto-size-sm); line-height: 1.55; }
body.woocommerce-checkout:not(.malarto-pay-hosted) #payment div.payment_box::before { content: none; }
@media (min-width: 768px) { body.woocommerce-checkout:not(.malarto-pay-hosted) #payment ul.wc_payment_methods:has(> li:nth-child(2)) { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.woocommerce #payment .malarto-pay-note { clear: both; display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: var(--malarto-s2) var(--malarto-s3); margin: 0; padding-top: var(--malarto-s3); }
.malarto-pay-note a { display: inline-flex; line-height: 0; }
.malarto-pay-note img { display: block; width: 120px; height: auto; }
@media (max-width: 767px) { .woocommerce #payment .malarto-pay-note { justify-content: center; text-align: center; } }

/* Zgody nad przyciskiem zamowienia uzywaja komponentu .m-checkline; tu tylko zdejmujemy formatowanie etykiet Woo. */
.malarto-consents .form-row { margin: 0; padding: 0; }
.woocommerce form .malarto-consents .form-row label.m-checkline { padding-left: 0; font-weight: var(--malarto-weight-body); font-size: var(--malarto-size-sm); line-height: 1.45; }
.woocommerce .malarto-consents a { color: inherit; text-underline-offset: 3px; }
.malarto-consents .required { color: var(--malarto-danger); text-decoration: none; }

/* ===== Promienie koncentryczne: wewnętrzny = zewnętrzny − padding, min 6px ===== */
:root { --malarto-radius-nested: max(6px, calc(var(--malarto-radius-lg) - var(--malarto-s3))); }
.malarto-term-aside, .malarto-place, .malarto-inclusions__grid .wp-block-column { --malarto-radius-nested: max(6px, calc(var(--malarto-radius-lg) - 20px)); }
.m-card { --malarto-radius-nested: max(6px, calc(var(--malarto-radius) - 20px)); }
.malarto-voucher-card { --malarto-radius-nested: max(6px, calc(var(--malarto-radius-lg) - 12px)); }
.malarto-term-aside .malarto-purchase button[type="submit"], .malarto-place .m-btn { border-radius: var(--malarto-radius-nested); }

/* ===== Strona Formatu: wierność Design /malowanie-ceramiki/ (MAL-374) ===== */
/* Kolejność sekcji jak w Design (intro, dla kogo, film, w cenie, terminy, FAQ) bez ruszania treści z edytora: siatka + order tylko na tej stronie. Kolejność DOM (czytniki) zostaje. */
.single-malarto_format .entry-content.wp-block-post-content { display: grid; grid-template-columns: minmax(0, 1fr); }
.single-malarto_format .entry-content > .malarto-format-head { order: -3; }
.single-malarto_format .entry-content > .malarto-audience { order: -2; }
.single-malarto_format .entry-content > .malarto-video { order: -1; }
.single-malarto_format .entry-content > .malarto-faq { order: 1; }
/* Ostatni pełnoszeroki pas dotyka stopki — kremowy pasek między nimi wyglądał jak niedokończona sekcja. */
.single-malarto_format .entry-content > .malarto-faq:last-child { margin-bottom: -64px; }
/* Intro: tekst .9fr po lewej, galeria minmax(440px, 1.1fr) po prawej, kolumna 48 px, dół 50 px jak .page-intro formatu. Wiersz lede = 1fr, żeby galeria nie rozpychała odstępu H1→lede (wada Design). */
/* Szerokość bierzemy z kolumny treści, nie z 100vw: jednostka vw liczy pasek przewijania, przez co nagłówek
   wystawał kilkanaście pikseli w prawo i kadr galerii wchodził pod pasek. */
.entry-content > .malarto-format-head { width: auto; max-width: none; margin: 0; display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); grid-template-rows: auto auto auto auto 1fr; grid-template-areas: "crumb crumb" "kicker media" "title media" "lede media" "facts media"; column-gap: 48px; align-items: start; padding-bottom: 50px; }
.malarto-format-head > .malarto-breadcrumbs { grid-area: crumb; margin: 0 0 var(--malarto-s3); }
.malarto-format-head > .malarto-format-kicker { grid-area: kicker; margin: 0 0 var(--malarto-s3); }
.malarto-format-head > .malarto-page-title { grid-area: title; margin: 0 0 var(--malarto-s5); font-size: var(--malarto-size-h1-page); }
.malarto-format-head > .m-lede { grid-area: lede; margin: 0 0 20px; max-width: 52ch; }
.malarto-format-head > .malarto-format-intro { grid-area: media; width: auto; max-width: none; margin: 0; }
.malarto-format-head .malarto-gallery { padding: 0; }
/* Etykieta „Szczegóły wydarzenia” dzieli zdjęcia od tekstu tylko w układzie jednokolumnowym
   (poniżej 1024 px). Na szerokim ekranie galeria stoi obok tekstu, więc nie ma czego rozdzielać. */
.malarto-format-head > .malarto-format-details-label { display: none; }
/* Poniżej 1024 px dwie kolumny robią się ciasne (tekst ~220 px, kadr przycięty), więc nagłówek schodzi na jedną kolumnę.
   Na telefonie zdjęcia formatu idą od razu pod tytuł, a tekst (lede, fakty) dopiero pod nimi — czytelnik najpierw
   widzi format, nie ścianę tekstu. `order` działa tylko we flex/grid, dlatego `display: flex` zamiast `block`;
   kolejność w DOM zostaje bez zmian dla czytników ekranu. Górne marginesy, które w układzie blokowym się składały
   (np. margin-bottom tytułu + margin-top galerii), zerujemy, żeby odstęp nie podwoił się we flexie. */
@media (max-width: 1023px) {
  .entry-content > .malarto-format-head { display: flex; flex-direction: column; align-items: stretch; row-gap: 0; padding-bottom: 32px; }
  .malarto-format-head > .malarto-breadcrumbs { order: 0; }
  .malarto-format-head > .malarto-format-kicker { order: 1; }
  .malarto-format-head > .malarto-page-title { order: 2; }
  .malarto-format-head > .malarto-format-intro { order: 3; margin-top: 0; margin-bottom: 0; }
  .malarto-format-head > .malarto-format-details-label { order: 4; display: block; margin: var(--malarto-s4) 0 0; padding-top: var(--malarto-s4); border-top: 1px solid var(--malarto-line); }
  .malarto-format-head > .m-lede { order: 5; margin-top: var(--malarto-s4); margin-bottom: 0; }
  .malarto-format-head > .malarto-format-facts { order: 6; margin-top: var(--malarto-s5); }
}
@media (max-width: 479px) {
  .malarto-format-head > .malarto-format-facts { grid-template-columns: minmax(0, 1fr); }
}
/* Notatka galerii nie wchodzi do nagłówka: tam liczy się tytuł, lede i fakty, a komentarz do zdjęć rozbijał kolumnę. */
.malarto-format-head .malarto-gallery > p { display: none; }
/* …ale odnośnik do strony galerii jest akcją, nie notatką: zostaje pod galerią w nagłówku. */
.malarto-format-head .malarto-gallery > p.malarto-gallery-all-link,
.malarto-format-head .malarto-gallery > p.malarto-gallery-more-link { display: block; margin: 12px 0 0; }
/* Strona galerii używała tego samego nagłówka bez prawej kolumny — trasa zniknęła razem z odnośnikiem
   (MAL-395: długa kolekcja otwiera się w lightboxie, a nie na osobnym adresie). */
/* Podgląd galerii Terminu siedział pod zdjęciem w kolumnie treści, obok ramki zakupu. Teraz bohaterem
   jest sama pierwsza galeria Formatu (zdjęcia z wydarzenia) z losowym zdjęciem startowym, więc nie ma
   drugiego zestawu tych samych zdjęć niżej. Galeria traci pionowy padding sekcji i stoi na linii
   kolumny treści, obok ramki zakupu — cena zostaje w pierwszym ekranie (MAL-394 zachowane). */
.malarto-term-hero-gallery { margin: 0 0 var(--malarto-s4); }
.malarto-term-hero-gallery > .malarto-gallery { margin: 0; padding: 0; }
.malarto-term-hero-gallery .malarto-gallery-all-link { margin: 12px 0 0; }
@media (min-width: 900px) {
  .malarto-term-hero-gallery .m-media__stage { aspect-ratio: auto; height: 430px; }
}
/* Telefon: nagłówek Terminu (tytuł, data i miejsce) i zdjęcie wydarzenia to jedna grupa, więc dzieli je
   krok tytułu (s5 = 24 px), a nie suma trzech właścicieli: marginesu leadu (20 px), dolnego paddingu
   nagłówka (32 px, s6) i odstępu bloków WordPressa (1.4rem = 22,4 px) — razem dawały 74,4 px przerwy
   między datą a kadrem, czyli największy odstęp strony w miejscu, które należy do jednej grupy.
   Odstęp bierze jeden właściciel: siatka treści Terminu. Poniżej 900 px odstępy rozdzielające (kadr →
   ramka zakupu, ramka zakupu → treść, sekcja → sekcja) trzymają s6 = 32 px, więc koniec sekcji jest
   zawsze wyraźnie większy od kroku tytuł → treść (20 px w akapicie, 24 px pod tytułem). Szeroki ekran
   Od makiety 2026-09-25 nagłówek to tylko okruszki i tytuł, więc ten sam jeden właściciel odstępu działa
   też na szerokim ekranie (s6 = 32 px od tytułu do kadru); wcześniej zostawało tam 78 px pustego pasa. */
.entry-content.wp-block-post-content > .m-intro.wp-block-group.malarto-term-head { padding-bottom: 0; }
.entry-content.wp-block-post-content > .m-intro.wp-block-group.malarto-term-head > h1.malarto-page-title { margin-bottom: 0; }
.entry-content.wp-block-post-content > .m-intro.wp-block-group.malarto-term-head + .malarto-term-layout { margin-block-start: var(--malarto-s4); }
@media (max-width: 899px) {
  .malarto-term-hero-gallery .m-media__stage { aspect-ratio: 16 / 9; }
  .entry-content.wp-block-post-content > .m-intro.wp-block-group.malarto-term-head + .malarto-term-layout { margin-block-start: var(--malarto-s5); row-gap: var(--malarto-s6); }
}
/* Treść Formatu (bloki z edytora) trzyma ten sam dolny rytm co pasma: bez tego przycisk
   „Zobacz terminy tego formatu” dotykał ciemnego pasma filmu (odstęp 0 px). */
.malarto-format-body { padding-bottom: var(--malarto-section-pad); }

/* Fakty Formatu: cena od, miasta i najbliższa data zamiast pustej kolumny pod lede. */
.malarto-format-head > .malarto-format-facts { grid-area: facts; display: grid; grid-template-columns: repeat(2, minmax(0, max-content)); justify-content: start; column-gap: var(--malarto-s6); row-gap: var(--malarto-s4); margin: var(--malarto-s4) 0 0; padding-top: var(--malarto-s4); border-top: 1px solid var(--malarto-line); }
.malarto-fact { display: grid; gap: 2px; }
.malarto-fact small { font-size: var(--malarto-size-xs); letter-spacing: .08em; text-transform: uppercase; color: var(--malarto-muted); }
.malarto-fact strong { font-size: var(--malarto-size-lg); font-weight: var(--malarto-weight-heavy); line-height: 1.15; }
.malarto-fact strong .woocommerce-Price-amount { font-size: inherit; }
.malarto-fact--wide { grid-column: 1 / -1; }
.malarto-format-facts__cta { grid-column: 1 / -1; justify-self: start; margin-top: var(--malarto-s2); }
@media (max-width: 899px) { .malarto-format-facts__cta { justify-self: stretch; text-align: center; } }
 /* sekcja galerii bez pionowego paddingu sekcji: górna krawędź zdjęcia w linii kickera */

/* Dla kogo: tło .tint-yellow, zdjęcie 16/9 licujące z krawędzią karty jak .m-card__photo, H3 24/700, treść 16 px, podpowiedź dociśnięta do dołu, siatka 16 px, przycisk do prawej nad linią. */
.wp-block-group.malarto-audience.m-section--honey { background: #fff0c2; }
/* Sekcje zapisane jako HTML nie dostają klas układu bloków WP. Komponent sam
   definiuje siatkę, aby odstępy działały także w opisie Formatu i Terminu. */
.wp-block-columns.malarto-audience__cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.malarto-audience__cards .wp-block-column { display: flex; flex-direction: column; overflow: hidden; }
.malarto-audience__cards .wp-block-column > .wp-block-image { margin: -20px -20px 16px; }
.malarto-audience__cards .wp-block-column > .wp-block-image img { aspect-ratio: 16/9; border-radius: var(--malarto-radius) var(--malarto-radius) 0 0; }
.malarto-audience__cards h3 { margin: 0 0 8px; font-size: clamp(20px, 1.5vw, 24px); line-height: 1.25; font-weight: var(--malarto-weight-bold); text-wrap: balance; }
.malarto-audience__cards p { font-size: var(--malarto-size-md); }
.malarto-audience__cards p.m-hint { margin-top: auto; padding-top: 12px; font-size: var(--malarto-size-sm); }
.malarto-audience > .wp-block-buttons.m-actions { justify-content: flex-end; margin-top: 28px; padding-top: 20px; border-top: 1px solid rgba(48, 44, 40, .16); }
@media (max-width: 639px) { .malarto-audience > .wp-block-buttons.m-actions .wp-block-button, .malarto-audience > .wp-block-buttons.m-actions .wp-block-button__link { width: 100%; } }
/* Kontener kart 540–1000 px: trzy wąskie kolumny dławią tekst (~24 znaki) i łamią tytuł, więc karta staje się wierszem jak termin: zdjęcie 200 px pozycjonowane względem karty (zero luzu nad i pod), treść po prawej.
   Liczy się szerokość kontenera, nie okna: w kolumnie Terminu (584–792 px) karty są wierszami także na desktopie. */
:has(> .malarto-audience__cards) { container-type: inline-size; }
@container (max-width: 539px) {
  .wp-block-columns.malarto-audience__cards { grid-template-columns: minmax(0, 1fr); }
}
@container (min-width: 540px) and (max-width: 1000px) {
  .wp-block-columns.malarto-audience__cards { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  /* .wp-block-columns w selektorze: rdzeń WP od 782 px daje kolumnom flex-basis: 0 (0,3,0), co przy overflow: hidden ucinało treść do min-height. */
  .wp-block-columns.malarto-audience__cards > .wp-block-column { flex: 0 0 auto; position: relative; justify-content: center; min-height: 168px; padding: 20px 20px 20px 220px; }
  .malarto-audience__cards .wp-block-column > .wp-block-image { position: absolute; top: 0; left: 0; bottom: 0; width: 200px; margin: 0; }
  .malarto-audience__cards .wp-block-column > .wp-block-image img { position: absolute; inset: 0; width: 100%; height: 100%; aspect-ratio: auto; border-radius: 0; }
  .malarto-audience__cards h3 { font-size: 22px; }
  .malarto-audience__cards p.m-hint { margin-top: 10px; padding-top: 0; }
}
/* Film formatu — pas pełnej szerokości: kadr 16:9 po lewej, kopia po prawej,
   obie kolumny wyrównane do góry na tej samej linii. Podział pół na pół, sztywny
   stosunek kadru (koniec z rozjeżdżającą się wysokością i literowaniem), jeden rytm
   odstępów i jeden akcent na rolę: słońce na kickerze i kropkach, glazura na przycisku. */
.entry-content > .malarto-video, main > .malarto-video { width: 100vw; max-width: none; margin: 0 0 0 calc(50% - 50vw) !important; /* !important: układ ograniczony WP daje dzieciom margin auto !important */ padding: var(--malarto-section-pad) var(--malarto-band-pad); border-radius: 0; background: var(--malarto-ink); color: #fff; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(32px, 4vw, 64px); align-items: start; }
.malarto-video__copy { grid-column: 2; grid-row: 1; }
.malarto-video__copy .m-kicker { color: var(--malarto-sun); margin-bottom: var(--malarto-s3); }
.malarto-video__copy h2 { color: #fff; margin: 0 0 var(--malarto-s3); font-size: clamp(26px, 2.6vw, 34px); line-height: 1.15; max-width: var(--malarto-heading-measure); text-wrap: pretty; }
.malarto-video__copy > p { color: #e7e1da; font-size: var(--malarto-size-lg); max-width: 46ch; margin: 0 0 var(--malarto-s5); text-wrap: pretty; }
.malarto-video__points { margin: 0 0 var(--malarto-s5); padding: 0; list-style: none; color: #e7e1da; font-size: var(--malarto-size-md); }
.malarto-video__points li { position: relative; margin-bottom: 10px; padding-left: 22px; }
.malarto-video__points li:last-child { margin-bottom: 0; }
.malarto-video__points li::before { content: ""; position: absolute; top: .58em; left: 2px; width: 8px; height: 8px; border-radius: 50%; background: var(--malarto-sun); }
.malarto-video__action { margin: 0; }
/* Kadr trzyma sztywny stosunek 16:9 i własny promień. Cienka jasna krawędź odcina
   czarny odtwarzacz od ciemnego pasa, bez cienia — karta siedzi w pasie, a nie unosi
   się nad nim. Odtwarzacz wypełnia kadr, więc nie ma ani przycięcia, ani literowania. */
.malarto-video-frame { grid-column: 1; grid-row: 1; position: relative; width: 100%; aspect-ratio: 16 / 9; border: 1px solid rgba(255, 255, 255, .16); border-radius: 18px; background: #000; overflow: hidden; }
.malarto-video-frame iframe { position: absolute; inset: 0; display: block; width: 100%; height: 100%; border: 0; }
.malarto-video-frame:focus-within { outline: 2px solid var(--malarto-sun); outline-offset: 3px; }
@media (max-width: 899px) { .entry-content > .malarto-video, main > .malarto-video { grid-template-columns: 1fr; gap: var(--malarto-s5); } .malarto-video__copy { grid-column: 1; grid-row: auto; } .malarto-video__copy > p { max-width: none; } .malarto-video__copy h2 { max-width: none; } .malarto-video-frame { grid-column: 1; grid-row: auto; } }
/* W cenie: bez linii sekcji, karty r14, H3 20/700 z 20 px pod spodem, mały przycisk (40 px, 8/13, 14 px, r12) jak .btn.small. */
.wp-block-group.malarto-inclusions.m-section--white { border-block: 0; }
.malarto-inclusions__grid .wp-block-column { border-radius: 14px; }
.malarto-inclusions__grid h3, .malarto-inclusions__grid .malarto-inclusions__title { margin: 0 0 20px; font-size: 20px; line-height: 1.25; font-weight: var(--malarto-weight-bold); }
.malarto-inclusions .wp-block-button__link { min-height: 40px; padding: 8px 13px; font-size: var(--malarto-size-sm); border-radius: 12px; }
/* WordPress dodaje obrazowi atrybuty width/height. Wskazówka prezentacyjna height sprawia, że wysokość nie jest auto,
   więc aspect-ratio z kitu nie kadruje. Karuzela tego nie ma, bo kit-enhance.js tworzy obrazy w JS bez tych atrybutów. */
.malarto-gallery--grid .m-gallery img { height: auto; }
/* Zwinięty katalog: sześć kafli na szerszym ekranie, trzy na telefonie — tyle, ile widać na raz,
   bez zamieniania strony w ścianę zdjęć (dwanascie kafli to 5 414 px na telefonie). Kafle zostają
   w DOM, więc lightbox siatki nadal otwiera całą kolekcję, a ukryte pliki nie są pobierane (lazy).
   Bez JavaScriptu wszystko zostaje widoczne — akcja odsłaniająca resztę jest ulepszeniem. */
.malarto-gallery--grid[data-collapsed="1"] .m-gallery > figure:nth-child(n+4) { display: none; }
@media (min-width: 680px) {
  .malarto-gallery--grid[data-collapsed="1"] .m-gallery > figure:nth-child(n+4) { display: block; }
  .malarto-gallery--grid[data-collapsed="1"] .m-gallery > figure:nth-child(n+7) { display: none; }
}
/* Z JavaScriptem próg liczy kit-enhance.js (dwa rzędy siatki, na telefonie trzy kafle). */
.malarto-gallery--grid[data-collapsed="1"][data-limit] .m-gallery > figure { display: block; }
.malarto-gallery--grid[data-collapsed="1"][data-limit] .m-gallery > figure.is-over { display: none; }
.malarto-gallery-more-link { margin: 12px 0 0; }
/* Licznik zdjęć obok nagłówka galerii — jak „8 zdjęć" w Design. */
.malarto-gallery-count { font-size: var(--malarto-size-sm); font-weight: var(--malarto-weight-body); color: var(--malarto-muted); white-space: nowrap; }
/* Podpis pod zdjęciem galerii: nazwa z biblioteki mediów plus druga linia z podpisu (np. „Kubek Wiking" / „280 ml"). */
.malarto-gallery-caption { display:block; margin-top:10px; color: var(--malarto-ink); }
.malarto-gallery-caption strong { display:block; font-size: var(--malarto-size-md); font-weight: var(--malarto-weight-bold); }
.malarto-gallery-caption span { display:block; font-size: var(--malarto-size-sm); color: var(--malarto-muted); }
.malarto-gallery-track a { text-decoration: none; }
/* W cenie na pełną szerokość: sekcja sama trzyma kolumnę treści, a dzieci nie dostają marginesów od układu WP — tak samo jak .malarto-video i .malarto-faq. */
.entry-content > .malarto-inclusions.m-section, main > .malarto-inclusions.m-section { padding-left: var(--malarto-band-pad); padding-right: var(--malarto-band-pad); }
.entry-content > .malarto-inclusions.m-section > *, main > .malarto-inclusions.m-section > * { margin-left: 0 !important; max-width: none; }
/* Terminy w układzie split mają węższą kolumnę niż pełna lista: ten sam kafel, tylko niższy. */
/* Kafel sam wie, że kolumna jest wąska (zapytanie kontenerowe w kicie) — nie nadpisujemy tu siatki. */
.m-row__thumb > img.malarto-hero { border-radius: 0; aspect-ratio: auto; }
/* Miejsce przy terminach: jedna karta .venue-card (tło #f5f1ea, r12, 20 px) z jednym kickerem; wewnętrzna karta bez własnego paddingu sekcji. */
.malarto-venue-rail { padding: 20px; border: 1px solid var(--malarto-line); border-radius: var(--malarto-radius); background: #f5f1ea; }
.malarto-venue-rail > .m-kicker { margin-bottom: var(--malarto-s3); }
.malarto-venue-rail .malarto-place { padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.malarto-venue-rail .malarto-place > .m-kicker { display: none; }
.malarto-venue-rail .malarto-place h3 { font-size: 20px; line-height: 1.25; font-weight: var(--malarto-weight-bold); margin: 0 0 20px; }
/* FAQ: dwie kolumny .7fr/1.3fr z odstępem 48 px, lista po prawej; pytania 18/800 z 20 px pionowo, odpowiedź wyciszona. */
.entry-content > .malarto-faq.m-section, main > .malarto-faq.m-section { display: grid; grid-template-columns: minmax(240px, .7fr) minmax(0, 1.3fr); grid-template-rows: auto auto 1fr; grid-template-areas: "kicker list" "h2 list" "lede list"; column-gap: 48px; align-items: start; padding-left: var(--malarto-band-pad); padding-right: var(--malarto-band-pad); }
.entry-content > .malarto-faq.m-section > *, main > .malarto-faq.m-section > * { margin-left: 0 !important; max-width: none; }
.entry-content > .malarto-faq.m-section > .m-kicker, main > .malarto-faq.m-section > .m-kicker { grid-area: kicker; }
.entry-content > .malarto-faq.m-section > h2, main > .malarto-faq.m-section > h2 { grid-area: h2; }
.entry-content > .malarto-faq.m-section > .m-lede, main > .malarto-faq.m-section > .m-lede { grid-area: lede; max-width: 44ch; }
.entry-content > .malarto-faq.m-section > .m-faq, main > .malarto-faq.m-section > .m-faq { grid-area: list; margin-top: 0; }
.malarto-faq .m-faq summary { padding: 20px 0; gap: 20px; font-size: 18px; font-weight: var(--malarto-weight-heavy); }
.malarto-faq .m-faq details > p { max-width: 68ch; margin: -4px 44px 20px 0; color: var(--malarto-muted); }
@media (max-width: 899px) { .entry-content > .malarto-faq.m-section, main > .malarto-faq.m-section { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto; grid-template-areas: "kicker" "h2" "lede" "list"; } }

/* Ekran po zakupie (szablon woocommerce/checkout/thankyou.php): kafel terminu obok „Co dalej”,
   szczegóły zamówienia schowane pod rozwijaniem. Komponenty są z kitu, tu tylko układ. */
.malarto-thankyou__head { max-width: var(--malarto-content); margin-bottom: var(--malarto-s7); }
.malarto-thankyou__head .m-h1 { margin-bottom: var(--malarto-s4); }
.malarto-thankyou__head .m-lede { overflow-wrap: anywhere; }
.malarto-thankyou--failed .malarto-thankyou__kicker { color: var(--malarto-danger); }
.malarto-thankyou__body { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: var(--malarto-s6); align-items: start; }
.malarto-thankyou__body:has(> :only-child) { grid-template-columns: minmax(0, 1fr); max-width: var(--malarto-content); }
/* WordPress daje każdemu obrazkowi max-width:100%, więc zdjęcie z klasą kitu nie dolicowywało
   do krawędzi karty (kit liczy width: calc(100% + 40px)). Karta Formatu ma zdjęcie w <figure>
   i własną regułę wyżej; tu chodzi o zdjęcie wstawione wprost jako <img>. */
img.m-card__photo { max-width: none; }
.malarto-thankyou__ticket .m-datebox { margin-bottom: var(--malarto-s4); }
.malarto-thankyou__actions { margin: var(--malarto-s5) 0 0; }
.malarto-thankyou__steps { display: grid; gap: var(--malarto-s5); margin: 0; padding: 0; list-style: none; }
.malarto-thankyou__steps p { margin: var(--malarto-s2) 0 0; }
.malarto-thankyou__list { margin: 0; padding-left: 20px; display: grid; gap: var(--malarto-s2); }
.malarto-thankyou__details { margin-top: var(--malarto-s7); padding-top: var(--malarto-s4); border-top: 1px solid var(--malarto-line); }
.malarto-thankyou__details > summary { cursor: pointer; font-weight: var(--malarto-weight-bold); }
.malarto-thankyou__details > summary::marker { color: var(--malarto-muted); }
.malarto-thankyou__details .woocommerce-order-details__title { display: none; }
.malarto-thankyou__details table.shop_table { width: 100%; margin: var(--malarto-s4) 0; border-collapse: collapse; table-layout: fixed; border: 0; }
.malarto-thankyou__details table.shop_table :is(th, td) { padding: var(--malarto-s3) 0; vertical-align: top; text-align: left; border: 0; border-bottom: 1px solid var(--malarto-line); }
.malarto-thankyou__details table.shop_table :is(th, td):last-child { width: 28%; padding-left: var(--malarto-s3); text-align: right; }
.malarto-thankyou__details table.shop_table .product-name { width: auto; }
.malarto-thankyou__details table.shop_table .product-total { white-space: nowrap; }
.malarto-thankyou__details table.shop_table tfoot td { overflow-wrap: anywhere; }
.malarto-thankyou__details .wc-item-meta { display: grid; gap: var(--malarto-s3); margin: var(--malarto-s3) 0 0; padding: 0; list-style: none; font-size: var(--malarto-size-sm); }
.malarto-thankyou__details .wc-item-meta li { margin: 0; overflow-wrap: anywhere; }
.malarto-thankyou__details .wc-item-meta strong { display: block; float: none; }
.malarto-thankyou__details .wc-item-meta p { display: block; margin: 0; }
[data-malarto-print][hidden] { display: none; }
@media print {
  @page { size: A4; margin: 15mm; }
  html:has(body.woocommerce-order-received) { background: white; }
  body.woocommerce-order-received, body.woocommerce-order-received .wp-site-blocks { background: white; color: black; padding-top: 0; }
  .woocommerce-order-received .wp-site-blocks { display: block; min-height: 0; }
  .woocommerce-order-received :is(.malarto-header, .malarto-footer, #wpadminbar, .malarto-cookies, .malarto-thankyou__aside, .malarto-thankyou__ticket > img, .malarto-thankyou .m-actions, [data-malarto-print]) { display: none; }
  .malarto-thankyou::before { content: 'Malarto'; display: block; font-size: 18px; font-weight: bold; }
  .woocommerce-order-received main.wp-block-group { padding: 0 !important; }
  .malarto-thankyou__head, .malarto-thankyou__details { margin-block: 16px; }
  .malarto-thankyou__head .m-h1 { font-size: 26px; max-width: none; }
  .malarto-thankyou__head .m-lede { font-size: 14px; }
  .malarto-thankyou__body { display: block; }
  .malarto-thankyou__ticket { padding: 0; box-shadow: none; border: 0; break-inside: avoid; }
  .malarto-thankyou__details > summary { list-style: none; }
  .malarto-thankyou__details tr { break-inside: avoid; }
}
.malarto-manual-instructions { grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); }
.malarto-manual-instructions .m-h3 { margin-top: 0; }
.malarto-manual-instructions__facts { display: grid; gap: var(--malarto-s5); margin: var(--malarto-s5) 0; }
.malarto-manual-instructions__facts dt { color: var(--malarto-muted); font-size: var(--malarto-size-sm); margin-bottom: var(--malarto-s2); }
.malarto-manual-instructions__facts dd { margin: 0; overflow-wrap: anywhere; }
.malarto-manual-instructions__method { border-top: 1px solid var(--malarto-line); margin-top: var(--malarto-s5); padding-top: var(--malarto-s5); }
.malarto-manual-instructions__method h3, .malarto-manual-instructions__method p:last-child { margin-bottom: 0; }
.malarto-manual-instructions__method h3 { margin-top: 0; }
.malarto-manual-instructions__extra, .malarto-manual-instructions__number { overflow-wrap: anywhere; }
.malarto-payment-copy { display: flex; flex-wrap: wrap; align-items: center; gap: var(--malarto-s3); margin: var(--malarto-s2) 0 var(--malarto-s4); }
.malarto-payment-copy__value { flex: 1 1 190px; min-width: 0; overflow-wrap: anywhere; font-weight: 600; user-select: all; -webkit-user-select: all; }
.malarto-payment-copy .m-btn { min-height: var(--malarto-control-h); }
.malarto-payment-copy__status { flex-basis: 100%; margin: 0; }
.malarto-payment-copy__status:empty { display: none; }
.malarto-thankyou__details .woocommerce-order-details__title, .malarto-thankyou__details .woocommerce-column__title { font-size: var(--malarto-size-lg); }
@media (max-width: 899px) { .malarto-thankyou__body { grid-template-columns: minmax(0, 1fr); } }

/* Termin według makiety uzgodnionej z klientem (2026-09-25): tytuł w skali h2, bez linii z datą pod nim —
   data, miejsce i cena mają wygrywać w metryczce. */
.entry-content.wp-block-post-content > .m-intro.wp-block-group.malarto-term-head > h1.malarto-page-title { font-size: 24px !important; line-height: 1.15; }
/* Metryczka: cena za osobę stoi pod etykietą na całej szerokości karty — stara cena przekreślona, obok duża
   aktualna, pod nimi krótka zachęta. „Liczba miejsc ograniczona” jako podpowiedź pod stepperem. */
.malarto-term-aside .malarto-facts > .malarto-facts__price { grid-template-columns: 1fr; gap: 4px; }
.malarto-term-aside .malarto-facts__price .malarto-price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 8px; font: var(--malarto-weight-heavy) var(--malarto-size-price)/1.1 var(--malarto-font-sans); }
.malarto-term-aside .malarto-facts__price .malarto-price del { margin: 0; color: var(--malarto-muted); font-size: var(--malarto-size-md); font-weight: var(--malarto-weight-body); }
.malarto-term-aside .malarto-early-note { display: block; color: var(--malarto-glaze-dark); font-weight: var(--malarto-weight-bold); }
.malarto-term-aside .malarto-purchase p.malarto-seats-note { margin: -2px 0 2px; }
/* Opis pod metryczką: zwinięty dopiero przez kit-enhance.js (bez JS cały widoczny). Wygaszenie dołu
   maską, nie nakładką w kolorze tła, więc działa na każdym tle sekcji. */
.malarto-term-description__body > :first-child { margin-top: 0; }
.malarto-term-description[data-collapsed="1"] .malarto-term-description__body { max-height: var(--malarto-description-peek, 420px); overflow: hidden; -webkit-mask-image: linear-gradient(to bottom, #000 85%, transparent); mask-image: linear-gradient(to bottom, #000 85%, transparent); }
.malarto-term-description__more { margin: var(--malarto-s3) 0 0; }
.malarto-term-jumps { display: grid; grid-template-columns: 1fr; justify-items: start; text-align: left; gap: var(--malarto-s2); margin: var(--malarto-s3) 0 0; padding-inline: var(--malarto-s5); font-size: var(--malarto-size-sm); line-height: 1.5; }
.malarto-term-jumps a { max-width: 100%; overflow-wrap: anywhere; }
@media (max-width: 639px) {
  .malarto-term-jumps { justify-items: center; text-align: center; }
}
@media (max-width: 899px) { .malarto-term-booking { grid-column: 1; grid-row: auto; } }
.malarto-term-main > .malarto-term-audience > h2 { margin-top: 0; }
.malarto-gallery[id], .malarto-term-description, .malarto-term-audience[id] { scroll-margin-top: calc(var(--malarto-header-h, 80px) + 16px); }
/* Film Formatu w kolumnie Terminu: ta sama ciemna karta co pas Formatu (kopia filmu jest jasna na ciemnym),
   ale w kolumnie jeden pod drugim — kadr nad tekstem, bo dwie połowy 380 px ściskały kopię. */
.malarto-term-main > .malarto-video { grid-template-columns: minmax(0, 1fr); gap: var(--malarto-s5); padding: var(--malarto-s5); background: var(--malarto-ink); color: #fff; }
/* Kadr dopasowany do istniejącego paddingu i promienia karty, bez zmiany odstępów. */
.malarto-term-main > .malarto-video .malarto-video-frame { border-radius: max(4px, calc(var(--malarto-radius-lg) - var(--malarto-s5))); }
.malarto-term-main > .malarto-video .malarto-video-frame, .malarto-term-main > .malarto-video .malarto-video__copy { grid-column: 1; grid-row: auto; }
.malarto-term-main > .malarto-video .malarto-video__copy h2 { max-width: var(--malarto-heading-measure); }

/* Event hierarchy: one scale for section headings, body copy and supporting labels. */
.malarto-term-layout { --malarto-size-h2: 28px; }
.malarto-term-layout h2 { font-size: var(--malarto-size-h2); line-height: 1.2; }
.malarto-term-layout .malarto-audience__cards h3,
.malarto-term-layout .malarto-place > h2,
.malarto-term-layout .malarto-inclusions__title { font-size: var(--malarto-size-lg); line-height: 1.3; }
.malarto-term-layout .m-lede,
.malarto-term-layout .malarto-video__copy > p { font-size: var(--malarto-size-md); line-height: 1.55; }
.malarto-term-layout .malarto-faq summary { font-size: var(--malarto-size-md); font-weight: var(--malarto-weight-semibold); }
.malarto-term-layout .m-kicker,
.malarto-term-layout .malarto-state,
.malarto-term-layout .malarto-gallery-caption,
.malarto-term-head .malarto-breadcrumbs { font-size: var(--malarto-size-sm); }
.malarto-term-layout .m-kicker { color: var(--malarto-glaze-dark); }
.malarto-term-layout .malarto-place > h2 { margin: 0 0 var(--malarto-s3); max-width: none; }
.malarto-term-layout .m-kicker + h2 { margin-top: 0; }
@media (max-width: 899px) { .malarto-term-layout { --malarto-size-h2: 24px; } }

.malarto-time-range { white-space: nowrap; }
.malarto-gallery-caption .malarto-gallery-item-note { margin-top: 4px; }

.malarto-gallery-browse { display: none; }
@media (max-width: 639px) { .malarto-gallery-browse { display: block; } }
.malarto-gallery-mobile { display: none; }
.malarto-gallery-mobile .m-media__stage { aspect-ratio: 1; }
@media (max-width: 639px) {
  .malarto-gallery-mobile { display: grid; }
  .malarto-gallery--grid[data-mobile-media="1"] > .m-gallery,
  .malarto-gallery--grid[data-mobile-media="1"] > .malarto-gallery-browse,
  .malarto-gallery--grid[data-mobile-media="1"] > .malarto-gallery-more-link { display: none; }
}

/* Native checkout fields and fragments share the same cards as the order sidebar. */
.woocommerce-checkout .malarto-checkout-summary { margin-bottom: var(--malarto-s6); }
.woocommerce-checkout form.checkout #customer_details { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--malarto-s4); margin-bottom: var(--malarto-s6); }
.woocommerce-checkout form.checkout #customer_details::before, .woocommerce-checkout form.checkout #customer_details::after { display: none; }
.woocommerce-checkout form.checkout #customer_details > .col-1, .woocommerce-checkout form.checkout #customer_details > .col-2 { float: none; width: 100%; }
/* Obudowa .m-card: białe tło, promień i cień kitu; bez obramowania zgłoszonego przez Tomasza. */
.woocommerce-checkout .malarto-checkout-aside > .malarto-checkout-summary,
.woocommerce-checkout form.checkout :is(.malarto-checkout-summary, .woocommerce-billing-fields, .woocommerce-additional-fields, .woocommerce-shipping-fields, #payment) { padding: 20px; border: 0; border-radius: var(--malarto-radius); background: var(--malarto-white); color: var(--malarto-ink); box-shadow: var(--malarto-shadow-card); }
.woocommerce-checkout form.checkout .woocommerce-shipping-fields:not(:has(*)) { display: none; }
.woocommerce-checkout form.checkout .woocommerce-billing-fields h3, .woocommerce-checkout form.checkout .woocommerce-additional-fields h3 { margin-top: 0; }
.woocommerce-checkout form.checkout #place_order { min-height: 48px; }
/* Booking details share the same readable alignment in Woo cart and checkout. */
.woocommerce td.product-name dl.variation { display: grid; grid-template-columns: minmax(50px, 100px) minmax(0, 1fr); gap: 4px 10px; margin: 8px 0 0; color: var(--malarto-muted); font-size: var(--malarto-size-sm); line-height: 1.5; }
.woocommerce td.product-name dl.variation dt, .woocommerce td.product-name dl.variation dd { float: none; padding: 0; margin: 0; min-width: 0; overflow-wrap: anywhere; }
.woocommerce td.product-name dl.variation dt { font-weight: var(--malarto-weight-medium); }
.woocommerce td.product-name dl.variation dd p { margin: 0; }
.woocommerce-checkout .malarto-checkout-summary > h3 { margin: 0 0 var(--malarto-s4); color: var(--malarto-ink); }
.woocommerce-checkout .malarto-checkout-summary .shop_table { margin-bottom: 0; border: 0; }
/* Keep the subtotal only when native adjustments make it useful. */
.woocommerce-checkout .malarto-checkout-summary .shop_table:not(:has(.cart-discount, .fee, .shipping, .tax-rate, .tax-total)) .cart-subtotal { display: none; }
.woocommerce-checkout .malarto-checkout-summary .order-total { background: var(--malarto-honey); clip-path: inset(0 round var(--malarto-radius-nested)); }
.woocommerce-checkout .malarto-checkout-summary .order-total > :is(th, td) { border: 0; background: transparent; }
.woocommerce-checkout .malarto-checkout-summary .order-total > :first-child { border-radius: var(--malarto-radius-nested) 0 0 var(--malarto-radius-nested); }
.woocommerce-checkout .malarto-checkout-summary .order-total > :last-child { border-radius: 0 var(--malarto-radius-nested) var(--malarto-radius-nested) 0; }
.woocommerce-checkout .malarto-checkout-summary .order-total > td > strong .amount { font-size: var(--malarto-size-lg); }
.woocommerce-checkout form.checkout #order_review_heading { padding-top: 0; border: 0; }
.woocommerce-checkout form.checkout #payment .form-row.place-order { padding: 0; }
.woocommerce-checkout .malarto-checkout-summary .order-total .includes_tax,
.woocommerce-checkout form.checkout .order-total .includes_tax { display: block; font-size: var(--malarto-size-xs); line-height: 1.5; margin-top: 4px; }
@media (max-width: 639px) {
  .woocommerce-checkout .shop_table .product-name { width: 70%; }
  .woocommerce-checkout .shop_table .product-total { white-space: nowrap; }
  .woocommerce td.product-name dl.variation { display: block; }
  .woocommerce td.product-name dl.variation dt { margin-top: 8px; font-size: var(--malarto-size-xs); }
  .woocommerce td.product-name dl.variation dd { overflow-wrap: normal; }
}
@media (max-width: 639px) { .woocommerce-checkout form.checkout .form-row-first, .woocommerce-checkout form.checkout .form-row-last { float: none; width: 100%; } .woocommerce-checkout form.checkout #place_order { width: 100%; } }

.malarto-time-range { white-space: nowrap; }
@media (max-width: 639px) {
  .woocommerce td.product-name dl.variation dt, .woocommerce td.product-name dl.variation dd { float: none; display: block; }
  .woocommerce-checkout .woocommerce-checkout-review-order-table { display: block; }
  .woocommerce-checkout .woocommerce-checkout-review-order-table thead, .woocommerce-checkout .woocommerce-checkout-review-order-table tfoot { display: table; width: 100%; table-layout: fixed; }
  .woocommerce-checkout .woocommerce-checkout-review-order-table tbody { display: block; }
  .woocommerce-checkout .woocommerce-checkout-review-order-table .cart_item { display: flex; align-items: flex-start; gap: 12px; }
  .woocommerce-checkout .woocommerce-checkout-review-order-table td.product-name { flex: 1; width: auto; min-width: 0; }
  .woocommerce-checkout .woocommerce-checkout-review-order-table td.product-total { flex: 0 0 auto; width: auto; }
  .woocommerce-checkout .woocommerce-checkout-review-order-table tfoot th { width: 40%; }
  .woocommerce-checkout .woocommerce-checkout-review-order-table tfoot td { text-align: right; }
}

/* Kod vouchera jest od razu dostępny; zachowuje natywną obsługę AJAX Woo. */
.malarto-checkout-voucher { margin-block: var(--malarto-s4); }
.woocommerce .malarto-checkout-voucher form.checkout_coupon { display:block !important; border:0; padding:0; margin:0; }
.malarto-checkout-voucher h2 { margin-top:0; }
.malarto-code-fields { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:var(--malarto-s3); margin-top:var(--malarto-s2); }
.malarto-code-fields input { min-width:0; }
.malarto-stripe-next { margin-block:var(--malarto-s4); }
.malarto-stripe-next p { margin:var(--malarto-s2) 0 0; }
@media(max-width:600px){.malarto-code-fields{grid-template-columns:1fr}.malarto-code-fields .m-btn{width:100%}}

/* Selected checkout composition: buyer/payment left, native order and voucher right. */
body.woocommerce-checkout:has(.malarto-checkout-layout) { --malarto-woo-column: 1080px; }
/* Keep Woo's inner wrapper on the same column as the title and breadcrumbs. */
body.woocommerce-checkout:has(.malarto-checkout-layout) main .woocommerce { max-width: var(--malarto-woo-column); }
body.woocommerce-checkout:has(.malarto-checkout-layout) main.wp-block-group { padding-top: var(--malarto-s7) !important; }
body.woocommerce-checkout:has(.malarto-checkout-layout) main > h1 { margin-bottom: var(--malarto-s5) !important; }
.malarto-checkout-layout { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 28px; align-items: start; }
.malarto-checkout-layout > form.checkout { grid-column: 1; grid-row: 1; min-width: 0; margin: 0; }
.malarto-checkout-layout > .malarto-checkout-aside { grid-column: 2; grid-row: 1; display: flex; flex-direction: column; gap: var(--malarto-s4); min-width: 0; }
/* Empty Woo notices must not create a flex item and a gap above the summary. */
.malarto-checkout-aside > .woocommerce-notices-wrapper:empty { display: none; }
.malarto-checkout-aside > .malarto-checkout-summary { order: 1; margin: 0; }
.malarto-checkout-aside > .malarto-checkout-voucher { order: 2; margin: 0; padding: 20px; }
.malarto-checkout-aside > .m-hint { order: 3; margin: 0; font-size: var(--malarto-size-xs); }
.malarto-checkout-aside .malarto-code-fields { grid-template-columns: minmax(0, 1fr); gap: var(--malarto-s2); }
.malarto-checkout-aside .checkout_coupon > p { margin: 0 0 var(--malarto-s2); }
.woocommerce-checkout .malarto-checkout-aside .shop_table { font-size: var(--malarto-size-sm); }
.woocommerce-checkout .malarto-checkout-aside .shop_table :is(th, td) { padding: 10px var(--malarto-s1); }
.woocommerce-checkout .malarto-checkout-aside .shop_table .product-name { width: 67%; }
.woocommerce-checkout .malarto-checkout-aside .shop_table .product-total { white-space: nowrap; }
.woocommerce-checkout .malarto-checkout-aside td.product-name dl.variation { display: block; font-size: var(--malarto-size-xs); }
.woocommerce-checkout .malarto-checkout-aside td.product-name dl.variation dt { margin-top: var(--malarto-s2); }
.woocommerce-checkout .malarto-checkout-aside .order-total .includes_tax { font-size: 11px; }
.woocommerce-checkout .malarto-checkout-layout form.checkout .woocommerce-billing-fields__field-wrapper { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--malarto-s4); }
.woocommerce-checkout .malarto-checkout-layout .woocommerce-billing-fields__field-wrapper > .form-row { grid-column: 1 / -1; float: none; width: auto; margin-bottom: var(--malarto-s3); }
.woocommerce-checkout .malarto-checkout-layout .woocommerce-billing-fields__field-wrapper > :is(.form-row-first, .form-row-last) { grid-column: auto; }
.woocommerce-checkout .malarto-checkout-layout form.checkout #customer_details { gap: var(--malarto-s6); }
.woocommerce-checkout .malarto-checkout-layout form.checkout :is(.woocommerce-billing-fields h3, .woocommerce-additional-fields h3) { margin-top: 0; }
.woocommerce-checkout .malarto-checkout-layout form.checkout .woocommerce-additional-fields textarea { min-height: 78px; height: 78px; }
.woocommerce-checkout .malarto-checkout-layout form.checkout #place_order { width: 100%; float: none; }
.woocommerce-checkout .malarto-checkout-layout form.checkout .optional { display: none; }
.woocommerce-checkout .malarto-checkout-layout .malarto-stripe-next p { font-size: var(--malarto-size-sm); line-height: 1.5; }
.woocommerce-checkout .malarto-checkout-layout #payment .malarto-pay-note { justify-content: flex-start; text-align: left; line-height: 1.5; }
@media (min-width: 768px) and (max-width: 900px) {
  .malarto-checkout-layout { grid-template-columns: minmax(0, 1fr) 320px; gap: var(--malarto-s5); }
  .woocommerce-checkout .malarto-checkout-layout form.checkout .woocommerce-billing-fields__field-wrapper { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 767px) {
  body.woocommerce-checkout:has(.malarto-checkout-layout) main.wp-block-group { padding-top: var(--malarto-s5) !important; }
  .malarto-checkout-layout { display: flex; flex-direction: column; gap: var(--malarto-s4); }
  .malarto-checkout-layout > .malarto-checkout-aside { order: 1; width: 100%; }
  .malarto-checkout-layout > form.checkout { order: 2; width: 100%; }
  .woocommerce-checkout .malarto-checkout-layout .woocommerce-billing-fields__field-wrapper > :is(.form-row-first, .form-row-last) { width: auto; }
  .woocommerce-checkout .malarto-checkout-layout #payment .malarto-pay-note { font-size: 11px; }
}

.malarto-contact-details img{border-radius:var(--malarto-radius-lg,14px)}

/* Po opisie: szczegóły w tej samej lewej kolumnie co galeria i opis. */
.malarto-term-details { grid-column: 1; min-width: 0; }
.malarto-term-details > .malarto-term-main { width: 100%; margin-inline: 0; }
/* Ukryte podpisy katalogu nie rezerwują pustego miejsca pod widocznym rzędem. */
.malarto-term-layout .malarto-gallery--grid .malarto-gallery-caption { min-height: 0 !important; }
.malarto-term-layout .malarto-gallery--grid > .malarto-gallery-more-link { margin-top: 0; }

/* Przejście od opisu do szczegółów ma tylko odstęp siatki, bez sumowania marginesów. */
.malarto-term-layout > .malarto-term-main > .malarto-term-description { margin-bottom: 0; }
.malarto-term-details > .malarto-term-main > .malarto-inclusions:first-child .malarto-inclusions__grid { margin-top: 0; }

/* Jeden rytm między sekcjami, bez sumowania ich zewnętrznych marginesów. */
.malarto-term-details { --malarto-term-section-gap: var(--malarto-s7); }
.malarto-term-details > .malarto-term-main { display: flex; flex-direction: column; gap: var(--malarto-term-section-gap); }
.malarto-term-layout .malarto-term-details > .malarto-term-main > * { margin-block: 0; }
.malarto-term-details > .malarto-term-main > .malarto-section:not(.malarto-video) { display: flow-root; }
.malarto-term-details .malarto-inclusions__grid { margin-top: 0; }
.malarto-term-details > .malarto-term-main > .malarto-voucher-promo--inline { padding: 0; }
/* Etykieta, nagłówek i wprowadzenie mają ten sam rytm w każdej sekcji. */
.malarto-term-details > .malarto-term-main > :is(.malarto-section, .m-section) > .m-kicker { margin: 0 0 var(--malarto-s2); }
.malarto-term-details > .malarto-term-main > :is(.malarto-section, .m-section) > h2 { margin: 0 0 var(--malarto-s4); }
.malarto-term-details > .malarto-term-main > :is(.malarto-section, .m-section) > p:not(.m-kicker):not(.malarto-gallery-more-link):not(.malarto-gallery-all-link) { margin: 0 0 var(--malarto-s5); }
.malarto-term-details > .malarto-term-main > :is(.malarto-section, .m-section) > p:last-child { margin-bottom: 0; }
.malarto-term-details .malarto-audience__cards { margin-block: var(--malarto-s5) 0; }
.malarto-term-details .malarto-gallery > .m-gallery,
.malarto-term-details .malarto-gallery > .m-media { margin-block: 0; }
.malarto-term-details .malarto-gallery > :is(.malarto-gallery-more-link, .malarto-gallery-all-link) { margin: var(--malarto-s4) 0 0; }
.malarto-term-details .malarto-video__copy > h2 { margin: 0 0 var(--malarto-s4); }
.malarto-term-details .malarto-video__copy > p:last-child { margin-bottom: 0; }
.malarto-term-details .malarto-inclusions__grid :is(h3, .malarto-inclusions__title) { margin: 0 0 var(--malarto-s5); }
@media (max-width: 899px) { .malarto-term-details { --malarto-term-section-gap: var(--malarto-s6); } }