/* B13 – „Okładka jak w albumie” (listopad 2026).
   Zdjęcie otwierające stoi samo, bez napisów na twarzach; tytuł jest złożony pod nim na tle strony,
   jak podpis pod zdjęciem w albumie.
   - telefon (do 781 px): wszystkie okładki (strona główna, podstrony, reportaże),
   - komputer: otwarcie reportażu (zdjęcie na wysokość ekranu, tytuł wyśrodkowany pod nim),
   - komputer, pozostałe okładki: napis zostaje na zdjęciu, ale stoi w tej samej linii co logo.
   Tylko CSS – treści, zdjęcia i bloki w panelu bez zmian. Cofnięcie: usunąć dołączenie tego pliku
   w functions.php (szukaj „okladki.css”). */

/* ---------- Wspólne: napisy w okładce trzymają lewą krawędź ----------
   Układ „constrained” centrował elementy z własną max-width (hasło 12ch, wstęp 36rem),
   przez co na telefonie hasło było wcięte, a w ofercie podtytuł uciekał na środek. */
.b13-hero .wp-block-cover__inner-container > * {
	margin-left: 0 !important;
}

/* ---------- Komputer: napis w linii z logo (siatka 1320 px jak w nagłówku) ---------- */
@media (min-width: 782px) {
	.b13-hero.wp-block-cover.has-custom-content-position .wp-block-cover__inner-container {
		width: 100% !important;
		max-width: 1320px;
		margin-inline: auto !important;
		padding-inline: 0 !important;
	}
}

/* ---------- Telefon: zdjęcie, pod nim tytuł ---------- */
@media (max-width: 781px) {
	.b13-hero.wp-block-cover {
		display: block;
		min-height: 0 !important;
		padding: 0 !important;
		overflow: visible;
		color: var(--wp--preset--color--contrast) !important;
		background: var(--wp--preset--color--base);
	}

	.b13-hero.wp-block-cover > picture {
		display: block;
	}

	.b13-hero.wp-block-cover .wp-block-cover__image-background {
		position: relative !important;
		inset: auto;
		display: block;
		width: 100% !important;
		height: auto !important;
		aspect-ratio: 4 / 5;
		object-fit: cover;
	}

	/* podstrony (oferta, Toruń…): niższy kadr, żeby treść strony była bliżej */
	body:not(.single-reportaz) .b13-hero-strony.wp-block-cover .wp-block-cover__image-background {
		aspect-ratio: 1 / 1;
	}

	.b13-hero.wp-block-cover .wp-block-cover__background {
		display: none !important;
	}

	.b13-hero.wp-block-cover .wp-block-cover__inner-container {
		box-sizing: border-box;
		width: 100% !important;
		max-width: none;
		margin: 0 !important;
		padding: var(--wp--preset--spacing--50) var(--wp--preset--spacing--40) var(--wp--preset--spacing--30) !important;
		color: inherit !important;
		text-shadow: none;
	}

	.b13-hero.wp-block-cover .wp-block-cover__inner-container > :first-child {
		margin-top: 0;
	}

	/* nadtytuł i mały H1 strony głównej – złoty, jak w sekcjach niżej */
	.b13-hero .wp-block-cover__inner-container > h1:not(.b13-tytul-reportazu),
	.b13-hero p.is-style-nadtytul,
	.b13-hero p.is-style-nadtytul.b13-na-zdjeciu {
		color: var(--wp--preset--color--accent) !important;
	}

	.b13-hero .b13-display,
	.b13-hero-strony.wp-block-cover h1,
	.b13-hero .b13-tytul-reportazu {
		color: var(--wp--preset--color--contrast) !important;
		text-shadow: none;
	}

	.b13-hero .b13-display {
		margin-top: .4rem;
	}

	.b13-hero .b13-lead,
	.wp-block-cover.b13-hero .b13-lead {
		color: var(--wp--preset--color--muted);
		opacity: 1;
	}

	/* przyciski: z białych (na zdjęciu) na ciemne (na jasnym tle) */
	.b13-hero .wp-block-button:not(.is-style-jasny-obrys):not(.is-style-outline) > .wp-block-button__link {
		background: var(--wp--preset--color--contrast);
		color: var(--wp--preset--color--base);
		border-color: var(--wp--preset--color--contrast);
	}

	.b13-hero .wp-block-button.is-style-jasny-obrys > .wp-block-button__link {
		color: var(--wp--preset--color--contrast);
		border-color: var(--wp--preset--color--contrast);
	}

	.b13-hero .wp-block-button.is-style-jasny-obrys > .wp-block-button__link:hover {
		background: var(--wp--preset--color--contrast);
		color: var(--wp--preset--color--base);
	}

	/* „Dzień ślubu w minutę”: kółko z ikoną odwrócone kolorystycznie */
	.b13-hero .b13-historia-start .b13-historia-start__ikona {
		background: var(--wp--preset--color--contrast);
	}

	.b13-hero .b13-historia-start .b13-historia-start__ikona::before {
		border-left-color: var(--wp--preset--color--base);
	}

	.b13-hero .b13-historia-start .b13-historia-start__ikona::after {
		border-color: var(--wp--preset--color--accent);
	}

	.b13-hero .b13-historia-start:hover .b13-historia-start__ikona {
		background: var(--wp--preset--color--base);
	}

	.b13-hero .b13-historia-start:hover .b13-historia-start__ikona::before {
		border-left-color: var(--wp--preset--color--contrast);
	}
}

/* ---------- Komputer: otwarcie reportażu ----------
   Zdjęcie na całą szerokość i wysokość ekranu (pod nagłówkiem), ale nie wyższe niż jego
   proporcje 3:2 – przycięte mniej niż dotąd (78vh). Tytuł pod zdjęciem, na środku. */
@media (min-width: 782px) {
	.single-reportaz .b13-hero.wp-block-cover {
		display: block;
		min-height: 0 !important;
		padding: 0 !important;
		overflow: visible;
		color: var(--wp--preset--color--contrast) !important;
		background: var(--wp--preset--color--base);
	}

	.single-reportaz .b13-hero.wp-block-cover > picture {
		display: block;
	}

	.single-reportaz .b13-hero.wp-block-cover .wp-block-cover__image-background {
		position: relative !important;
		inset: auto;
		display: block;
		width: 100% !important;
		height: min(calc(100vh - 74px), 66.667vw) !important;
		height: min(calc(100svh - 74px), 66.667vw) !important;
		min-height: 420px;
		object-fit: cover;
	}

	.single-reportaz .b13-hero.wp-block-cover .wp-block-cover__background {
		display: none !important;
	}

	.single-reportaz .b13-hero.wp-block-cover .wp-block-cover__inner-container {
		box-sizing: border-box;
		max-width: 1120px;
		padding: var(--wp--preset--spacing--70) var(--wp--preset--spacing--40) 0 !important;
		text-align: center;
		color: inherit !important;
		text-shadow: none;
	}

	.single-reportaz .b13-hero .wp-block-cover__inner-container > * {
		margin-left: auto !important;
		margin-right: auto !important;
	}

	.single-reportaz .b13-hero p.is-style-nadtytul {
		color: var(--wp--preset--color--accent) !important;
	}

	.single-reportaz .b13-hero .b13-tytul-reportazu {
		margin-top: .9rem;
		color: var(--wp--preset--color--contrast) !important;
		font-size: clamp(3rem, 6.2vw, 5.75rem) !important;
		font-weight: 300 !important;
		text-shadow: none;
	}

	.single-reportaz .b13-hero .b13-lead {
		max-width: 34em;
		margin-top: 1.4rem;
		color: var(--wp--preset--color--muted);
		opacity: 1;
	}

	/* krótka złota linia zamyka stronę tytułową – dalej wstęp i zdjęcia */
	.single-reportaz .b13-hero .wp-block-cover__inner-container::after {
		content: "";
		display: block;
		width: 56px;
		height: 1px;
		margin: var(--wp--preset--spacing--60) auto 0;
		background: var(--wp--preset--color--accent);
	}
}

/* Telefon w reportażu: ta sama złota linia, wyrównana do lewej */
@media (max-width: 781px) {
	.single-reportaz .b13-hero .wp-block-cover__inner-container::after {
		content: "";
		display: block;
		width: 44px;
		height: 1px;
		margin-top: var(--wp--preset--spacing--50);
		background: var(--wp--preset--color--accent);
	}
}