/*
 * MMA O nas
 * Wersja: 1.4.8
 * Zaktualizowany: 2026-04-28
 * Zmiany 1.4.8 (fix7, 2026-04-28):
 *   - KOREKTA v1.4.7 fix6 P2: Hero h1 /o-nas/ na mobile (≤991px) ma się mieścić w 2 wierszach.
 *     Klient w ACF wpisał tekst w 4 liniach z Enterami → nl2br() w section-hero.php L70 daje
 *     hardcoded <br> → 4 wiersze niezależne od font-size CSS. Rozwiązanie: ukryć <br> w mobile
 *     (.mma-onas-hero__h1 br { display: none }) + zmniejszyć clamp z (34px, 9vw, 48px) na
 *     (18px, 4.5vw, 32px) — naturalne łamanie po szerokości daje 2 wiersze (Oswald 700 uppercase,
 *     ~30 znaków/wiersz). line-height 1.15 → 1.2 (lepsze proporcje przy mniejszym foncie).
 *     Dodano text-wrap: balance (Chrome 114+/Safari 17.4+ — równe 2 wiersze; fallback graceful
 *     = greedy wrap, też 2 wiersze). Desktop bez zmian (klient zachowuje 4 wiersze z Enterów ACF
 *     w 2-kolumnowym Hero desktop). fix6 P1 (text-align: center) bez zmian.
 * Zmiany 1.4.7 (fix6, 2026-04-28):
 *   - P1: Mobile (≤991px) — trzy nagłówki sekcji /o-nas/ (Hero h1 + Książka h2 + Karo h2,
 *         de facto wszystkie .mma-onas-hero__h1 + .mma-onas-section__h2) wycentrowane horyzontalnie
 *         (text-align: center). Desktop bez zmian.
 *   - P2: Mobile (≤991px) — nagłówek Hero /o-nas/ (.mma-onas-hero__h1 + warianty ACF small/medium/large)
 *         font-size: clamp(34px, 9vw, 48px); line-height: 1.15 !important — 1:1 z .mma-wsp-intro__haslo
 *         na /wspolpraca/ mobile (referencja: mma-wspolpraca.css v0.6.0 fix11 P3). Wzrost z ~22px na ~34px
 *         (375px viewport, +55%). Pozostałe h2 /o-nas/ (Książka, Karo itd.) bez zmian.
 *         [v1.4.8 fix7: P2 zostało skorygowane — patrz wyżej.]
 * Zmiany 1.4.6 (fix5, 2026-04-27):
 *   - REWERS v1.4.5 (FIX3). Klient sprostował: na /o-nas/ ma być UKRYTY
 *     wyłącznie page-title H1 „O nas" wraz z żółtym separatorem (to robi
 *     `mma-cart.css` fix4 FIX2: `.mma-onas-page-header h1.mma-cart-page-title`
 *     + `::after`). H2 hero z ACF („Jesteśmy Karola i Bartek I wiemy,
 *     jak wygląda animacja od środka!") = `.mma-onas-hero__h1` ORAZ żółta
 *     kreska pod nim (`.mma-onas-separator`) MUSZĄ być widoczne.
 *     Usunięta blokowa reguła `display:none` z końca pliku (była dodana
 *     v1.4.5 przez nieporozumienie — różne elementy o podobnych nazwach).
 * Zmiany 1.4.5 (FIX3) — REWERSOWANE:
 *   - Klient: ukryć H2 (`.mma-onas-hero__h1`) i żółty separator (`.mma-onas-separator`)
 *     w sekcji `.mma-onas-hero` na /o-nas/. Page-title H1 „O nas" w `.mma-onas-page-header`
 *     zostaje (to inny element, nad breadcrumbami).
 * Zmiany 1.4.4:
 *   - Korekta v1.4.3: TYLKO kolor przycisku „Zobacz szkolenia" (.mma-onas-cta .mma-onas-btn--secondary)
 *     wraca do czarnego (jak v1.4.2): bg #1a1a1a / hover bg #333333 + box-shadow 0 10px 28px rgba(0,0,0,0.35) + opacity 0.93.
 *     Rozmiar / typografia / hover transform — BEZ ZMIAN (zachowane z v1.4.3, czyli 1:1 z .mma-home-baner-btn--yellow).
 *     „Kup książkę w sklepie" + „Sprawdź sklep" — żółte (bez zmian).
 * Zmiany 1.4.3:
 *   - P1: Wszystkie 3 przyciski na /o-nas/ (Książka „Kup książkę w sklepie" + CTA „Sprawdź sklep" + CTA „Zobacz szkolenia")
 *         1:1 z .mma-home-baner-btn.mma-home-baner-btn--yellow.mma-home-btn-unified (sekcja baner home):
 *         padding 16×40, Oswald 700/18px, letter-spacing 1px, border-radius 100px, bg #f5c518, color #1a1a1a,
 *         hover bg #e6b800 + translateY(-2px) + box-shadow 0 8px 24px rgba(0,0,0,0.2) + opacity 0.92.
 *         „Zobacz szkolenia" zmienia kolor z czarnego (Hero --secondary) na żółty (baner --yellow) — odwrotność v1.4.0.
 *         min-width 240px (desktop) i mobile clamp 1:1 z baner-btn mobile.
 *   - P2: Ikony w sekcji „Liczby" 2× większe — 56→112 px (desktop), clamp(44,9vw,56)→clamp(88,18vw,112) (mobile).
 * Zmiany 1.4.2:
 *   - P1+P3: Książka primary 1:1 z .mma-onas-cta .mma-onas-btn--primary — usunięty border 3px white (desktop+mobile),
 *            wspólny min-width: 240px na desktop dla wszystkich 3 przycisków /o-nas/, mobile = identyczne wartości jak CTA.
 *   - P2: ACF naglowek (text→textarea) + helper mma_onas_h_with_breaks() — Enter w kokpicie => <br> w h1/h2.
 * Zmiany 1.4.1 (2026-04-26):
 *   - P1: Książka primary — border 3px solid #ffffff (jak Hero primary na home) + wyśrodkowanie w kolumnie (desktop)
 *   - P2: Mobile (≤991px) — kolejność: tytuł → opis → zdjęcie → CTA; rozmiar przycisku clamp(14–16) / clamp(12–14×18–24) jak home /o-nas/ mobile
 *   - P3: Liczby — ikony/liczby/opisy wyśrodkowane w kafelku (text-align + align-items: center)
 *   - P4: No-orphans — helper mma_onas_no_orphans() w PHP (NBSP po a/i/o/u/w/z); brak zmian CSS
 * Zmiany 1.4.0 (2026-04-26):
 *   - P1: Opisy (.mma-onas-body) — Inter 16px / 1.75 (jak .mma-home-onas-content na home)
 *   - P2: Przycisk „Kup książkę w sklepie" — kolor/hover/rozmiar jak na home /o-nas/, pozycja tuż pod opisem
 *   - P3: Sekcja Liczby — białe kafelki w stylu Współpracy (1×4 desktop, 2×2 mobile, bez żółtego tła)
 *   - P4: Jeden breakpoint mobile = 991px (poza Hero — sekcja zamrożona)
 *   - P5: CTA przyciski — bez białego obramowania, kolory jak home (.mma-home-hero-btn--primary / --secondary)
 */

/* ── WRAPPER STRONY ── */
.mma-onas-page {
	overflow-x: clip;
}

@supports not (overflow-x: clip) {
	.mma-onas-page {
		overflow-x: hidden;
	}
}

/* ── NAGŁÓWEK STRONY (breadcrumb + H1) ──
   v1.1.5 (2026-04-27, form-unify fix2): tło ujednolicone z `.mma-onas-hero` (`#f8f8f8`),
   żeby breadcrumby + H1 i sekcja Hero stanowiły jeden ciągły szary pas (klient skarżył się
   na widoczny szew między dwoma odcieniami szarego — wcześniej było `#f4f4f4`). */
.mma-onas-page-header {
	background: #f8f8f8;
}
.mma-onas-page-header .mma-onas-inner {
	padding-top: 20px;
	padding-bottom: 24px;
}

/* ── INNER — max-width jak strona główna (zgodnie z .container z webflow.css) ── */
.mma-onas-inner {
	max-width: 1210px;
	margin: 0 auto;
	padding: 0 20px;
}

/* ── KOLORY TŁA ── */
.mma-onas-page .bg-white {
	background: #ffffff;
}
.mma-onas-page .bg-gray {
	background: #f8f8f8;
}
.mma-onas-page .bg-yellow {
	background: #fec009;
}

/* ── SEKCJA BASE ── */
.mma-onas-section {
	padding: 64px 0;
}
@media (max-width: 991px) {
	.mma-onas-section {
		padding: 40px 0;
	}
}

/* Galeria → CTA → stopka: równy „pas” — brak dodatkowego dołu galerii, symetryczny padding CTA. */
.mma-onas-page .mma-onas-galeria.mma-onas-section {
	padding-bottom: 0;
}
.mma-onas-page .mma-onas-cta.mma-onas-section {
	padding-top: 80px;
	padding-bottom: 80px;
}
@media (max-width: 991px) {
	.mma-onas-page .mma-onas-cta.mma-onas-section {
		padding-top: 48px;
		padding-bottom: 48px;
	}
}

.mma-onas-hero {
	background-color: #f8f8f8;
	padding-top: 40px;
	padding-bottom: 40px;
}
@media (min-width: 769px) {
	.mma-onas-hero {
		min-height: calc(100vh - 256px);
		display: flex;
		align-items: center;
	}
}

/* ── SEPARATOR ── */
.mma-onas-separator {
	height: 3px;
	width: 48px;
	background: #fec009;
	border-radius: 2px;
	margin: 10px 0 20px;
}

/* Ukryj żółte separatory pod nagłówkami (O nas) */
.mma-onas-section__h2 + .mma-onas-separator,
.mma-onas-hero__h1 + .mma-onas-separator,
.mma-onas-centered .mma-onas-separator,
.mma-onas-section__h2--center + .mma-onas-separator {
	display: none;
}

/* ── TAGLINE ── */
.mma-onas-tagline {
	font-family: 'Oswald', sans-serif;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	color: #fec009;
	margin-bottom: 20px;
}

/* ── HERO ── */
.mma-onas-hero__inner {
	display: flex;
	align-items: center;
	gap: 60px;
}
.mma-onas-hero__text {
	flex: 1;
}
.mma-onas-hero__img-wrap {
	flex: 0 0 36%;
	border: 3px solid #f5c518;
	border-radius: 16px;
	overflow: hidden;
	filter: drop-shadow(0 8px 24px rgba(0, 0, 0, 0.15));
}
.mma-onas-hero__img-wrap--large {
	flex: 0 0 36%;
}
.mma-onas-hero__img-wrap--medium {
	flex: 0 0 28%;
}
.mma-onas-hero__img-wrap--small {
	flex: 0 0 20%;
}
.mma-onas-hero__img {
	width: 100%;
	display: block;
	border-radius: 13px;
}
.mma-onas-hero__h1 {
	font-family: 'Oswald', sans-serif;
	font-weight: 700;
	font-size: clamp(26px, 3.5vw, 42px);
	line-height: 1.15;
	color: #1a1a2e;
	text-transform: uppercase;
	letter-spacing: -0.5px;
	margin: 0 0 24px;
}
.mma-onas-hero__lead {
	font-size: 16px;
	line-height: 1.75;
	color: #374151;
	max-width: 520px;
	margin: 0;
}
@media (max-width: 900px) {
	.mma-onas-hero__inner {
		flex-direction: column;
		gap: 28px;
	}
	.mma-onas-hero__img-wrap,
	.mma-onas-hero__img-wrap--large,
	.mma-onas-hero__img-wrap--medium,
	.mma-onas-hero__img-wrap--small {
		flex: none;
		width: 100%;
		max-width: 500px;
		margin: 0 auto;
	}
}
@media (max-width: 768px) {
	.mma-onas-hero__img-wrap,
	.mma-onas-hero__img-wrap--large,
	.mma-onas-hero__img-wrap--medium,
	.mma-onas-hero__img-wrap--small {
		max-width: 400px;
		width: 92%;
	}
}

/* Mobile ≤767: Hero — zdjęcie pod nagłówkiem (H2), nad leadem (opis) */
@media (max-width: 767px) {
	.mma-onas-hero .mma-onas-hero__inner {
		display: flex;
		flex-direction: column;
		align-items: stretch;
	}
	.mma-onas-hero .mma-onas-hero__text {
		display: contents;
	}
	.mma-onas-hero .mma-onas-hero__text > .mma-onas-tagline {
		order: 1;
	}
	.mma-onas-hero .mma-onas-hero__text > .mma-onas-hero__h1 {
		order: 2;
	}
	.mma-onas-hero .mma-onas-hero__text > .mma-onas-separator {
		order: 3;
	}
	.mma-onas-hero .mma-onas-hero__img-wrap {
		order: 4;
	}
	.mma-onas-hero .mma-onas-hero__text > .mma-onas-hero__lead {
		order: 5;
	}
}

/* ── NAGŁÓWEK SEKCJI ── */
.mma-onas-section__h2 {
	font-family: 'Oswald', sans-serif;
	font-weight: 700;
	font-size: clamp(22px, 3vw, 34px);
	line-height: 1.2;
	color: #1a1a2e;
	text-transform: uppercase;
	letter-spacing: -0.3px;
	margin: 0 0 20px;
}
.mma-onas-section__h2--center {
	text-align: center;
}

/* ── ROK ── */
.mma-onas-rok {
	font-family: 'Oswald', sans-serif;
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: #b08a00;
	margin-bottom: 14px;
}

/* ── DWUKOLUMNOWY LAYOUT ── */
.mma-onas-twocol {
	display: flex;
	gap: 56px;
	align-items: center;
}
.mma-onas-twocol--reverse {
	flex-direction: row-reverse;
}
.mma-onas-twocol__text {
	flex: 1;
}
.mma-onas-twocol__img {
	flex: 0 0 42%;
}
.mma-onas-twocol__img img {
	width: 100%;
	border-radius: 12px;
	display: block;
}
@media (max-width: 991px) {
	.mma-onas-twocol,
	.mma-onas-twocol--reverse {
		flex-direction: column;
		gap: 28px;
	}
	.mma-onas-twocol__img {
		flex: none;
		width: 100%;
	}
	/* Książka — mobile (P2 v1.4.1): lead → img → CTA (CTA na samym dole, pod zdjęciem) */
	.mma-onas-ksiazka__grid--has-img,
	.mma-onas-ksiazka--text-right .mma-onas-ksiazka__grid--has-img {
		grid-template-columns: 1fr !important;
		grid-template-areas:
			"lead"
			"img"
			"cta" !important;
		column-gap: 28px;
		row-gap: 28px;
	}
	.mma-onas-ksiazka__grid:not(.mma-onas-ksiazka__grid--has-img) {
		grid-template-columns: 1fr !important;
		grid-template-areas:
			"lead"
			"cta" !important;
	}
	/* CTA desktop ukryty na mobile, CTA mobile widoczny */
	.mma-onas-ksiazka__lead .mma-onas-ksiazka__cta {
		display: none !important;
	}
	.mma-onas-ksiazka__cta--mobile {
		display: flex !important;
		justify-content: center;
		margin-top: 8px;
	}
}

/* ── KSIĄŻKA (P2: CTA jest teraz wewnątrz .mma-onas-ksiazka__lead, tuż pod opisem) ── */
.mma-onas-ksiazka__grid {
	display: grid;
	align-items: center;
	column-gap: 56px;
	row-gap: 20px;
}
.mma-onas-ksiazka__lead {
	grid-area: lead;
}
.mma-onas-ksiazka__img {
	grid-area: img;
}
.mma-onas-ksiazka__img img {
	width: 100%;
	max-width: 580px;
	border-radius: 4px;
	filter: drop-shadow(0 8px 28px rgba(0, 0, 0, 0.14));
	margin: 0 auto;
	display: block;
}
.mma-onas-ksiazka__img.mma-onas-img--small img {
	max-width: 360px;
}
.mma-onas-ksiazka__img.mma-onas-img--medium img {
	max-width: 480px;
}
/* CTA desktop — wewnątrz leadu, wyśrodkowany w kolumnie (P1 v1.4.1) */
.mma-onas-ksiazka__lead .mma-onas-ksiazka__cta {
	margin-top: 24px;
	display: flex;
	justify-content: center;
}
.mma-onas-ksiazka__lead .mma-onas-ksiazka__cta .mma-onas-btn-wrap {
	display: flex;
	justify-content: center;
	margin-top: 0;
}
.mma-onas-ksiazka__lead .mma-onas-ksiazka__cta .mma-onas-btn-wrap .mma-onas-btn {
	margin: 0;
}
/* CTA mobile — poza leadem, ostatni element grida; widoczny tylko ≤991px (P2 v1.4.1) */
.mma-onas-ksiazka__cta--mobile {
	display: none;
	grid-area: cta;
}
.mma-onas-ksiazka__cta--mobile .mma-onas-btn-wrap {
	display: flex;
	justify-content: center;
	margin-top: 0;
	width: 100%;
}
.mma-onas-ksiazka__cta--mobile .mma-onas-btn-wrap .mma-onas-btn {
	margin: 0;
}
/* Wszystkie 3 przyciski /o-nas/ (Książka primary + CTA primary + CTA secondary) = 1:1 z .mma-home-baner-btn--yellow (v1.4.3) */
.mma-onas-ksiazka .mma-onas-btn--primary,
.mma-onas-cta .mma-onas-btn,
.mma-onas-cta .mma-onas-btn--primary,
.mma-onas-cta .mma-onas-btn--secondary {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 16px 40px;
	font-family: 'Oswald', sans-serif;
	font-weight: 700;
	font-size: 18px;
	line-height: 1;
	letter-spacing: 1px;
	text-transform: uppercase;
	border: none;
	border-radius: 100px;
	background: #f5c518;
	color: #1a1a1a;
	text-decoration: none;
	text-align: center;
	white-space: nowrap;
	cursor: pointer;
	transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease, background 0.2s ease;
	min-width: 240px;
	box-sizing: border-box;
}
.mma-onas-ksiazka .mma-onas-btn--primary:hover,
.mma-onas-cta .mma-onas-btn:hover,
.mma-onas-cta .mma-onas-btn--primary:hover,
.mma-onas-cta .mma-onas-btn--secondary:hover {
	background: #e6b800;
	color: #1a1a1a;
	transform: translateY(-2px);
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
	opacity: 0.92;
}
/* „Zobacz szkolenia" — TYLKO kolor wraca do czarnego (rozmiar/typografia z reguły zbiorczej wyżej bez zmian) (v1.4.4) */
.mma-onas-cta .mma-onas-btn--secondary {
	background: #1a1a1a;
	color: #ffffff;
}
.mma-onas-cta .mma-onas-btn--secondary:hover {
	background: #333333;
	color: #ffffff;
	transform: translateY(-2px);
	box-shadow: 0 10px 28px rgba(0, 0, 0, 0.35);
	opacity: 0.93;
}
/* Tekst lewo, zdjęcie prawo */
.mma-onas-ksiazka:not(.mma-onas-ksiazka--text-right) .mma-onas-ksiazka__grid--has-img {
	grid-template-columns: 1fr min(52%, min(600px, 46vw));
	grid-template-areas: "lead img";
}
.mma-onas-ksiazka:not(.mma-onas-ksiazka--text-right) .mma-onas-ksiazka__grid:not(.mma-onas-ksiazka__grid--has-img) {
	grid-template-columns: 1fr;
	grid-template-areas: "lead";
}
/* Tekst prawo, zdjęcie lewo */
.mma-onas-ksiazka--text-right .mma-onas-ksiazka__grid--has-img {
	grid-template-columns: min(52%, min(600px, 46vw)) 1fr;
	grid-template-areas: "img lead";
}
.mma-onas-ksiazka--text-right .mma-onas-ksiazka__grid:not(.mma-onas-ksiazka__grid--has-img) {
	grid-template-columns: 1fr;
	grid-template-areas: "lead";
}

/* ── BODY TEXT (P1: zsync z .mma-home-onas-content na home — Inter 16px / 1.75) ── */
.mma-onas-body {
	font-family: 'Inter', sans-serif;
	font-size: 16px;
	line-height: 1.75;
	color: #374151;
}
.mma-onas-body--center {
	text-align: center;
	max-width: 640px;
	margin: 0 auto;
}
.mma-onas-body p {
	margin-bottom: 16px;
}
.mma-onas-body p:last-child {
	margin-bottom: 8px;
}
.mma-onas-body strong {
	color: #1a1a2e;
	font-weight: 600;
}

/* ── CYTAT ── */
.mma-onas-cytat {
	border-left: 3px solid #fec009;
	padding: 8px 14px;
	margin: 28px 0;
	font-size: 14px;
	font-style: italic;
	color: #6b7280;
	background: #fffbeb;
	border-radius: 0 6px 6px 0;
}

/* ── WYŚRODKOWANY BLOK ── */
.mma-onas-centered {
	text-align: center;
}
.mma-onas-podtytul {
	font-size: 16px;
	color: #374151;
	margin: 8px auto 32px;
	max-width: 580px;
	line-height: 1.65;
}

/* ── FILM ── */
.mma-onas-video {
	position: relative;
	width: 100%;
	max-width: 880px;
	margin: 0 auto;
	padding-bottom: min(56.25%, 495px);
	height: 0;
	border-radius: 12px;
	overflow: hidden;
	box-shadow: 0 4px 24px rgba(0, 0, 0, 0.12);
}
.mma-onas-video iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: none;
}
.mma-onas-video-placeholder {
	max-width: 880px;
	margin: 0 auto;
	padding: 40px;
	background: #f4f4f4;
	border-radius: 12px;
	color: #6b7280;
	font-size: 15px;
	text-align: center;
	border: 2px dashed #e5e5e5;
}

/* Odstępy: nagłówek / podtytuł / wideo (O nas + strona główna) */
.mma-onas-film__header {
	margin-bottom: 8px;
}
.mma-onas-film .mma-onas-section__h2 {
	margin-bottom: 18px;
}
.mma-onas-film .mma-onas-podtytul {
	margin-bottom: 36px;
}
.mma-onas-film .mma-onas-film__col--video .mma-onas-video-wrap,
.mma-onas-film .mma-onas-film__col--video .mma-onas-video-placeholder {
	margin-top: 0;
}
.mma-onas-film .mma-onas-centered > .mma-onas-video-wrap,
.mma-onas-film .mma-onas-centered > .mma-onas-video-placeholder {
	margin-top: 32px;
}
.mma-onas-film__row {
	display: flex;
	align-items: center;
	gap: 48px;
	margin-top: 28px;
}
.mma-onas-film__row--text-right {
	flex-direction: row-reverse;
}
.mma-onas-film__col {
	flex: 1;
	min-width: 0;
}
.mma-onas-film__col--text {
	flex: 1 1 44%;
}
.mma-onas-film__col--video {
	flex: 1 1 56%;
	min-width: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}
.mma-onas-film__col--video .mma-onas-video-wrap,
.mma-onas-film__col--video .mma-onas-video-placeholder {
	max-width: 100%;
	width: 100%;
}
/* Ramka jak hero (żółta) — tylko O nas / sekcje z .mma-onas-film */
.mma-onas-film .mma-onas-video-wrap {
	border: 3px solid #f5c518;
	border-radius: 16px;
	overflow: hidden;
	box-sizing: border-box;
}
.mma-onas-film .mma-onas-video-poster .mma-onas-video-thumb {
	border-radius: 13px;
}
.mma-onas-film .mma-onas-video--hidden.is-playing iframe {
	border-radius: 13px;
}
.mma-onas-film__col--text .mma-onas-section__h2 {
	margin-bottom: 20px;
}
.mma-onas-film__col--text .mma-onas-body {
	margin-top: 0;
}
.mma-onas-film__col--text .mma-onas-body + .mma-onas-body {
	margin-top: 8px;
}
@media (max-width: 991px) {
	.mma-onas-film__row,
	.mma-onas-film__row--text-right {
		flex-direction: column;
		gap: 28px;
	}
	.mma-onas-film__col--video {
		display: block;
		width: 100%;
	}
	.mma-onas-film__col--text {
		flex: 1 1 auto;
	}
	.mma-onas-film__col--video .mma-onas-video-wrap,
	.mma-onas-film__col--video .mma-onas-video-placeholder {
		margin-top: 0;
	}
}

/* Vimeo: poster + przycisk play (klik → iframe) */
.mma-onas-video-wrap {
	max-width: 880px;
	margin: 32px auto 0;
	position: relative;
}
.mma-onas-video-wrap.mma-onas-video-wrap--playing {
	background: #000;
	border-radius: 12px;
	overflow: hidden;
}
.mma-onas-video-poster {
	position: relative;
	cursor: pointer;
	border-radius: 12px;
	overflow: hidden;
	display: block;
	background: #000;
}
.mma-onas-video-poster .mma-onas-video-thumb {
	width: 100%;
	display: block;
	border-radius: 12px;
	transition: opacity 0.2s ease;
}
.mma-onas-video-poster:hover .mma-onas-video-thumb {
	opacity: 0.85;
}
.mma-onas-play-btn {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 68px;
	height: 48px;
	transition: transform 0.2s ease, opacity 0.2s ease;
	filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.4));
}
.mma-onas-video-poster:hover .mma-onas-play-btn {
	transform: translate(-50%, -50%) scale(1.1);
}
.mma-onas-video--hidden {
	display: none;
}
.mma-onas-video--hidden.is-playing {
	display: block;
	position: relative;
	width: 100%;
	max-width: 880px;
	margin: 0 auto;
	padding-bottom: 0;
	height: auto;
	background: #000;
	border-radius: 12px;
	overflow: hidden;
}
.mma-onas-video--hidden.is-playing iframe {
	position: static;
	width: 100%;
	aspect-ratio: 16 / 9;
	height: auto;
	border: 0;
	border-radius: 12px;
	background: #000;
}
.mma-onas-video-poster.is-hidden {
	display: none;
}

/* ── GALERIA ── */
.mma-onas-galeria__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 14px;
	margin-bottom: 0;
}
.mma-onas-galeria__item {
	cursor: pointer;
}
.mma-onas-galeria__item img {
	width: 100%;
	height: 210px;
	object-fit: cover;
	border-radius: 10px;
	display: block;
}
/* Lightbox galerii O nas — te same klasy co karuzela na stronie głównej (#mmGaleriaLb) */
.mma-galeria-lightbox {
	display: none;
	position: fixed;
	inset: 0;
	background: rgba(0, 0, 0, 0.92);
	z-index: 9999;
	align-items: center;
	justify-content: center;
	cursor: zoom-out;
}
.mma-galeria-lightbox.open {
	display: flex;
}
/* Ramka ściśle wokół zdjęcia (bez „letterboxa” w obramowaniu) */
.mma-galeria-lightbox .mma-galeria-lb-frame {
	display: inline-block;
	max-width: min(90vw, 100%);
	max-height: 88vh;
	line-height: 0;
	border: 4px solid #f5c518;
	border-radius: 12px;
	box-shadow: 0 0 60px rgba(245, 197, 24, 0.3);
	overflow: hidden;
}
.mma-galeria-lightbox .mma-galeria-lb-frame img {
	display: block;
	width: auto;
	height: auto;
	max-width: calc(90vw - 8px);
	max-height: calc(88vh - 8px);
	object-fit: contain;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	cursor: default;
}
.mma-galeria-lb-close {
	position: absolute;
	top: 20px;
	right: 28px;
	color: #f5c518;
	font-size: 36px;
	font-weight: 700;
	cursor: pointer;
	line-height: 1;
	background: none;
	border: none;
	padding: 0;
}
.mma-galeria-lb-close:hover {
	color: #fff;
}
/* Galeria: bez przycisku pod siatką — odstępy do CTA tylko przez padding sekcji (patrz .mma-onas-galeria / .mma-onas-cta). */
@media (max-width: 991px) {
	.mma-onas-galeria__grid {
		grid-template-columns: repeat(2, 1fr);
	}
	.mma-onas-galeria__item img {
		height: clamp(150px, 22vw, 210px);
	}
}

/* Sekcja Karo: więcej oddechu pod H2 (separator ukryty) */
.mma-onas-karo .mma-onas-centered .mma-onas-section__h2 {
	margin-bottom: 28px;
}
.mma-onas-karo .mma-onas-centered .mma-onas-body--center {
	margin-top: 4px;
}

/* ── LICZBY (P3: białe kafelki w stylu Współpracy — 1×4 desktop / 2×2 mobile) ── */
.mma-onas-liczby__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
}
.mma-onas-liczby__card {
	position: relative;
	background: #ffffff;
	border: 1px solid #e5e5e5;
	border-radius: 14px;
	padding: 32px 24px;
	box-shadow: 0 2px 16px rgba(0, 0, 0, 0.08);
	transition: transform 0.2s, box-shadow 0.2s;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 16px;
	text-align: center;
}
.mma-onas-liczby__card:hover {
	transform: translateY(-4px);
	box-shadow: 0 6px 28px rgba(0, 0, 0, 0.14);
}
.mma-onas-liczby__ikona {
	width: 112px;
	height: 112px;
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
.mma-onas-liczby__ikona img,
.mma-onas-liczby__ikona svg {
	width: 100%;
	height: 100%;
	object-fit: contain;
	display: block;
	color: #1a1a2e;
	stroke: #1a1a2e;
}
.mma-onas-liczby__num {
	display: block;
	font-family: 'Oswald', sans-serif;
	font-weight: 700;
	font-size: 32px;
	color: #1a1a2e;
	line-height: 1;
	margin: 0 auto;
	text-align: center;
	text-transform: uppercase;
}
.mma-onas-liczby__opis {
	display: block;
	font-family: 'Inter', sans-serif;
	font-size: 15px;
	line-height: 1.6;
	color: #6b7280;
	margin: 0 auto;
	text-align: center;
}

/* ── OFERTA KAFELKI ── */
.mma-onas-oferta__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
	margin-top: 12px;
}
.mma-onas-oferta__card {
	background: #ffffff;
	border: 1px solid #e5e5e5;
	border-radius: 14px;
	padding: 32px 28px;
}
.mma-onas-oferta__icon {
	font-size: 30px;
	margin-bottom: 18px;
	line-height: 1;
}
.mma-onas-oferta__title {
	font-family: 'Oswald', sans-serif;
	font-weight: 600;
	font-size: 18px;
	color: #1a1a2e;
	text-transform: uppercase;
	letter-spacing: 0.02em;
	margin: 0 0 14px;
}
.mma-onas-oferta__body {
	font-size: 14px;
	line-height: 1.7;
	color: #6b7280;
	margin: 0;
}
@media (max-width: 991px) {
	.mma-onas-oferta__grid {
		grid-template-columns: 1fr;
		gap: 16px;
	}
	.mma-onas-oferta__card {
		padding: 24px 18px;
	}
}

/* ── PRZYCISKI ── */
.mma-onas-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-family: 'Oswald', sans-serif;
	font-size: 15px;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	text-decoration: none;
	border-radius: 50px;
	padding: 13px 34px;
	margin: 4px 6px 0;
	transition: transform 0.2s, box-shadow 0.2s, opacity 0.15s, background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
	cursor: pointer;
}
.mma-onas-btn--primary {
	background: #fec009;
	color: #1a1a2e;
	border: none;
}
.mma-onas-btn--primary:hover {
	background: #e5a309;
	transform: translateY(-2px);
	box-shadow: 0 10px 28px rgba(0, 0, 0, 0.2);
	color: #1a1a2e;
}
.mma-onas-btn--secondary {
	background: #1a1a1a;
	color: #ffffff;
	border: none;
}
.mma-onas-btn--secondary:hover {
	background: #333333;
	color: #ffffff;
	transform: translateY(-2px);
	box-shadow: 0 10px 28px rgba(0, 0, 0, 0.35);
}

/* ── CTA PRZYCISKI (v1.4.3: rozmiar/kolor/hover wspólne z Książka — patrz reguła zbiorcza wyżej) ── */
.mma-onas-cta__btns {
	margin-top: 32px;
	display: flex;
	gap: 20px;
	justify-content: center;
	flex-wrap: wrap;
}

/* ── MOBILE WSPÓLNY (P4: jeden breakpoint 991px — tablet = telefon, proporcjonalne skalowanie) ── */
@media (max-width: 991px) {
	/* Liczby — 2 kolumny po 2 wiersze (P3) */
	.mma-onas-liczby__grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 16px;
	}
	.mma-onas-liczby__card {
		padding: clamp(20px, 4vw, 32px) clamp(16px, 3vw, 24px);
		gap: 12px;
	}
	.mma-onas-liczby__ikona {
		width: clamp(88px, 18vw, 112px);
		height: clamp(88px, 18vw, 112px);
	}
	.mma-onas-liczby__num {
		font-size: clamp(22px, 5vw, 32px);
	}
	.mma-onas-liczby__opis {
		font-size: clamp(13px, 2.5vw, 15px);
	}
	/* CTA — kolumnowo, proporcjonalnie (układ stosu) */
	.mma-onas-cta__btns {
		flex-direction: column;
		align-items: center;
		gap: 12px;
		margin-top: 22px;
	}
	/* Wszystkie 3 przyciski /o-nas/ mobile = 1:1 z .mma-home-baner-btn mobile (clamp 14–18 / 14–16 × 20–40) (v1.4.3) */
	.mma-onas-ksiazka .mma-onas-btn--primary,
	.mma-onas-cta .mma-onas-btn,
	.mma-onas-cta .mma-onas-btn--primary,
	.mma-onas-cta .mma-onas-btn--secondary {
		width: 60% !important;
		min-width: 200px !important;
		max-width: 100% !important;
		font-size: clamp(14px, 1.8vw, 18px) !important;
		padding: clamp(14px, 1.6vw, 16px) clamp(20px, 3.2vw, 40px) !important;
		border-radius: 100px !important;
		border: none;
		white-space: nowrap;
		text-align: center;
	}
	/* fix6 P1 (2026-04-28): trzy nagłówki sekcji /o-nas/ (Hero h1 + Książka h2 + Karo h2 + pozostałe section h2)
	   wycentrowane horyzontalnie w mobile. Desktop bez zmian. */
	.mma-onas-hero__h1,
	.mma-onas-section__h2 {
		text-align: center;
	}
	/* fix7 (2026-04-28): KOREKTA fix6 P2 — Hero h1 /o-nas/ ma się mieścić w 2 wierszach na mobile.
	   Klient wpisał w ACF tekst w 4 liniach (z Enterami) — nl2br() w section-hero.php L70 daje
	   hardcoded <br> → 4 wiersze niezależne od font-size CSS. Trzeba ukryć <br> w mobile, żeby
	   browser łamał tekst naturalnie po szerokości. Clamp zmniejszony z (34, 9vw, 48) na
	   (18, 4.5vw, 32) — Oswald 700 uppercase, ~30 znaków/wiersz daje 2 wiersze na całym zakresie
	   mobile (360–991px). text-wrap: balance dla nowoczesnych przeglądarek (Chrome 114+/Safari
	   17.4+) — auto-rozdziela równo na 2 wiersze; fallback graceful = greedy wrap, też 2 wiersze.
	   !important ponieważ modifier .mma-onas-h--<size> ma specyficzność 0,2,0 — taką samą jak
	   nasze nadpisanie. Desktop bez zmian (klient zachowuje 4 wiersze z Enterów ACF). */
	.mma-onas-hero__h1 br {
		display: none;
	}
	.mma-onas-hero__h1,
	.mma-onas-hero__h1.mma-onas-h--small,
	.mma-onas-hero__h1.mma-onas-h--medium,
	.mma-onas-hero__h1.mma-onas-h--large {
		font-size: clamp(18px, 4.5vw, 32px) !important;
		line-height: 1.2 !important;
		text-wrap: balance;
	}
}

/* ── ROZMIARY NAGŁÓWKÓW (kokpit O nas) ── */
.mma-onas-h--small,
.mma-onas-section__h2.mma-onas-h--small,
.mma-onas-hero__h1.mma-onas-h--small,
.mma-onas-liczby__num.mma-onas-h--small {
	font-size: clamp(16px, 2vw, 22px);
}
.mma-onas-h--medium,
.mma-onas-section__h2.mma-onas-h--medium,
.mma-onas-hero__h1.mma-onas-h--medium,
.mma-onas-liczby__num.mma-onas-h--medium {
	font-size: clamp(20px, 2.5vw, 28px);
}
.mma-onas-h--large,
.mma-onas-section__h2.mma-onas-h--large,
.mma-onas-hero__h1.mma-onas-h--large,
.mma-onas-liczby__num.mma-onas-h--large {
	font-size: clamp(22px, 3vw, 34px);
}

/* ── ROZMIARY ZDJĘĆ (dwie kolumny) ── */
.mma-onas-img--small {
	flex: 0 0 20%;
}
.mma-onas-img--medium {
	flex: 0 0 30%;
}
.mma-onas-img--large {
	flex: 0 0 42%;
}

/* ════════════════════════════════════════════════════════════════════════
   v1.4.6 (2026-04-27, fix5) — REWERS v1.4.5 (FIX3).
   Klient sprostował: H2 hero z ACF („Jesteśmy Karola i Bartek I wiemy,
   jak wygląda animacja od środka!") + żółta kreska pod nim MUSZĄ być
   WIDOCZNE. Ukryty pozostaje tylko page-title H1 „O nas" + jego
   żółta kreska — robione w `mma-cart.css` fix4 FIX2 (selektor
   `.mma-onas-page-header h1.mma-cart-page-title` + `::after`).
   Reguła v1.4.5 została usunięta — żadnego override'u nie potrzeba,
   `.mma-onas-hero__h1` dziedziczy display: block; (zob. L176).
   ════════════════════════════════════════════════════════════════════════ */