/* ===== Prymart FSE — custom CSS poza tokenami theme.json ===== */

:root {
	--prymart-radius-lg: 28px;
	--prymart-radius-pill: 999px;
	--prymart-transition: 200ms cubic-bezier(.4,0,.2,1);
}

body {
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

/* === HERO — fire-show photo with blob mask === */

.prymart-hero {
	position: relative;
	overflow: hidden;
}

.prymart-hero__media {
	position: relative;
	aspect-ratio: 4 / 5;
	width: 100%;
	max-width: 720px;
	margin-inline: auto;
}

@media (min-width: 900px) {
	.prymart-hero__media { max-width: 100%; aspect-ratio: 5 / 6; }
}

/* === Video player card (replaces previous CTA media blob) === */
.prymart-video {
	position: relative;
	aspect-ratio: 16 / 10;
	width: 100%;
	border-radius: 24px;
	overflow: hidden;
	cursor: pointer;
	background: #000;
	box-shadow: 0 24px 60px -20px rgba(165, 106, 240, .25), 0 0 0 1px rgba(255,255,255,.06);
	transition: var(--prymart-transition);
}
.prymart-video:hover { transform: translateY(-2px); box-shadow: 0 30px 70px -20px rgba(165, 106, 240, .4), 0 0 0 1px rgba(255,255,255,.1); }
.prymart-video:focus-visible { outline: 3px solid var(--wp--preset--color--purple); outline-offset: 3px; }
.prymart-video img.prymart-video__poster {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	filter: brightness(.7) saturate(1.1);
	transition: var(--prymart-transition);
}
.prymart-video:hover img.prymart-video__poster { filter: brightness(.55) saturate(1.2); }
.prymart-video .prymart-play-btn {
	position: absolute;
	top: 50%; left: 50%;
	transform: translate(-50%, -50%);
	pointer-events: none;
}
.prymart-video__label {
	position: absolute;
	left: 1.5rem;
	bottom: 1.5rem;
	color: #fff;
	font-weight: 600;
	font-size: .95rem;
	letter-spacing: .02em;
	text-shadow: 0 2px 8px rgba(0,0,0,.5);
	pointer-events: none;
}

/* Modal dialog for video */
dialog.prymart-video-dialog {
	border: none;
	padding: 0;
	background: transparent;
	max-width: min(90vw, 1120px);
	width: 100%;
}
dialog.prymart-video-dialog::backdrop { background: rgba(0,0,0,.85); backdrop-filter: blur(8px); }
dialog.prymart-video-dialog .dialog-body {
	position: relative;
	aspect-ratio: 16 / 9;
	border-radius: 16px;
	overflow: hidden;
	background: #000;
}
dialog.prymart-video-dialog iframe { width: 100%; height: 100%; border: 0; }
dialog.prymart-video-dialog .dialog-close {
	position: absolute;
	top: -3rem; right: 0;
	background: rgba(255,255,255,.12);
	color: #fff;
	border: 0;
	border-radius: 999px;
	width: 40px; height: 40px;
	cursor: pointer;
	font-size: 1.5rem;
	line-height: 1;
}
dialog.prymart-video-dialog .dialog-close:hover { background: var(--wp--preset--color--purple); color: var(--wp--preset--color--dark); }

.prymart-hero__media > figure,
.prymart-hero__media .wp-block-image {
	margin: 0;
	width: 100%;
	height: 100%;
}
.prymart-hero__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	-webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 720'><path fill='black' d='M90 70c80-50 200-60 290-10 90 50 140 140 130 240-10 110-60 200-160 250-100 50-220 50-300-20-80-70-110-180-80-290 30-110 70-130 120-170z'/></svg>");
	mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 720'><path fill='black' d='M90 70c80-50 200-60 290-10 90 50 140 140 130 240-10 110-60 200-160 250-100 50-220 50-300-20-80-70-110-180-80-290 30-110 70-130 120-170z'/></svg>");
	-webkit-mask-size: contain;
	mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
}

.prymart-hero__media::before {
	content: "";
	position: absolute;
	inset: -10% 5% auto auto;
	width: 38%;
	aspect-ratio: 1;
	background: radial-gradient(circle at 30% 30%, var(--wp--preset--color--purple), var(--wp--preset--color--purple-dark) 70%);
	border-radius: 65% 35% 70% 30% / 60% 50% 50% 40%;
	z-index: -1;
	opacity: .9;
}

.prymart-hero__media::after {
	content: "";
	position: absolute;
	inset: auto -5% -10% 10%;
	width: 35%;
	aspect-ratio: 1;
	background: var(--wp--preset--color--yellow);
	border-radius: 40% 60% 55% 45% / 50% 60% 40% 50%;
	z-index: -1;
	opacity: .35;
}

/* === Sections flow — kill 24px WP gap between header/main/footer === */

body { background: var(--wp--preset--color--white); }

.wp-site-blocks > *,
:where(.wp-site-blocks) > * { margin-block-start: 0 !important; margin-block-end: 0 !important; }

/* post-content renders as <main>, sekcje alignfull w srodku tez musza się
   stykac bez 24px gap WordPressa — ale TYLKO alignfull (calostronicowe
   sekcje z wlasnym paddingiem). Zwykle akapity/naglowki bez tej klasy
   (np. na /o-nas/, /kontakt/, pozycjach repertuaru) zachowuja domyslny
   odstep. */
.wp-block-post-content > .alignfull { margin-block-start: 0 !important; margin-block-end: 0 !important; }

/* HTML block alignfull tweak (for our manual alignfull on html blocks) */
/* `100vw` to szerokosc RAZEM z pionowym paskiem przewijania, a `100%` na <html>
   juz go nie zawiera — roznica daje grubosc paska i pozwala rozciagnac sekcje
   dokladnie do krawedzi tresci, bez ucinania i bez poziomego suwaka. */
html { --prymart-pasek: calc(100vw - 100%); }
.alignfull {
	margin-left: calc(50% - 50vw + var(--prymart-pasek, 0px) / 2);
	margin-right: calc(50% - 50vw + var(--prymart-pasek, 0px) / 2);
	max-width: calc(100vw - var(--prymart-pasek, 0px));
}

/* === Header navigation === */

/* Sticky on the <header> template-part wrapper so the full-bleed white bar stays at top */
.wp-site-blocks > header,
.wp-site-blocks > .wp-block-template-part[data-slug="header"],
header.wp-block-template-part {
	position: sticky;
	top: 0;
	z-index: 50;
	background: var(--wp--preset--color--white);
}

.prymart-header {
	background: var(--wp--preset--color--white) !important;
	backdrop-filter: blur(8px);
	border-bottom: 1px solid color-mix(in srgb, var(--wp--preset--color--dark) 6%, transparent);
}

/* Constrain header content to wideSize for a wider, more breathing layout */
.prymart-header__inner {
	width: 100%;
	max-width: var(--wp--style--global--wide-size, 1240px);
	margin-inline: auto;
}

.prymart-logo img {
	height: 38px;
	width: auto;
}

/* === Dark section utility === */

.prymart-section-dark {
	background: var(--wp--preset--color--dark);
	color: var(--wp--preset--color--white);
}

/* All text in dark sections defaults to white — beats WP global `h1..h6 { color: var(--text) }` rules */
.prymart-section-dark,
.prymart-section-dark h1,
.prymart-section-dark h2,
.prymart-section-dark h3,
.prymart-section-dark h4,
.prymart-section-dark h5,
.prymart-section-dark h6,
.prymart-section-dark p,
.prymart-section-dark li,
.prymart-section-dark strong,
.prymart-section-dark em,
.prymart-section-dark a:not(.wp-block-button__link) {
	color: var(--wp--preset--color--white);
}

/* Defeat WP-generated `.has-text-color { color: var(--text) !important }`
   for headings/paragraphs using a palette accent color.
   Uwaga: od przeniesienia sluga "text" na pozycję 0 w theme.json ta regula
   jest redundantna — zostawiona celowo jako zabezpieczenie, gdyby kolejnosc
   palety znow sie zmienila. Nie usuwac bez sprawdzenia theme.json. */
.prymart-section-dark .has-purple-color,
.prymart-section-dark h1.has-purple-color,
.prymart-section-dark h2.has-purple-color,
.prymart-section-dark h3.has-purple-color,
.prymart-section-dark p.has-purple-color {
	color: var(--wp--preset--color--purple) !important;
}
.prymart-section-dark .has-muted-color { color: rgba(255,255,255,.65) !important; }

/* === Counters === */

.prymart-counter {
	text-align: left;
}
.prymart-counter__number {
	font-size: clamp(2.5rem, 5vw, 4rem);
	font-weight: 800;
	color: var(--wp--preset--color--purple);
	line-height: 1;
	letter-spacing: -0.02em;
}
.prymart-counter__label {
	font-size: 1rem;
	color: var(--wp--preset--color--white);
	opacity: .8;
	margin-top: .5rem;
	display: block;
}

/* === Trust strip (logos) — Zaufali nam marquee === */

.prymart-marquee { overflow: hidden; width: 100%; margin-top: 2.5rem; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.prymart-marquee__track { display: flex; align-items: center; gap: 3.5rem; width: max-content; animation: prymart-marquee 60s linear infinite; }
.prymart-marquee:hover .prymart-marquee__track { animation-play-state: paused; }
.prymart-marquee__track img { height: 60px; width: auto; max-width: 240px; object-fit: contain; flex: 0 0 auto; filter: grayscale(1); opacity: .6; transition: filter .2s, opacity .2s; }
.prymart-marquee__track img:hover { filter: none; opacity: 1; }
@keyframes prymart-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) {
	.prymart-marquee__track { animation: none; flex-wrap: wrap; width: 100%; justify-content: center; }
	/* Druga seria (aria-hidden) sluzy tylko plynnej petli scrollu; przy wylaczonej
	   animacji trzeba ja ukryc wizualnie, inaczej kazda instytucja pokazuje sie 2x. */
	.prymart-marquee__track [aria-hidden="true"] { display: none; }
	/* Maska lewej/prawej krawedzi ma sens tylko przy przewijanej tasmie -
	   po zawinieciu do siatki (flex-wrap: wrap) gasi loga na brzegu KAZDEGO
	   rzedu, nie tylko calego paska. Wylaczyc razem z animacja. */
	.prymart-marquee { -webkit-mask-image: none; mask-image: none; }
}

/* Karty pod logotypami — źródła mieszane (PNG/JPG/GIF) mają różne tła;
   spójna biała podkładka ujednolica wygląd i chowa "plamy" po tle oryginałów. */
.prymart-marquee__logo {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #fff;
	border-radius: 10px;
	padding: 0.55rem 1.1rem;
	box-shadow: 0 1px 2px rgba(0, 0, 0, .06);
}

/* === Stonoga — pasek patronow medialnych i fakty === */

.prymart-media-strip { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 1.75rem 2.5rem; margin-top: 1rem; }
.prymart-media-strip img { height: 44px; width: auto; max-width: 160px; object-fit: contain; background: #fff; border-radius: 8px; padding: 6px 10px; box-shadow: 0 1px 2px rgba(0, 0, 0, .06); }
.prymart-stonoga-fakty { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem; margin-top: 3.5rem; text-align: center; }
.prymart-stonoga-fakty b { display: block; font-size: 2rem; font-weight: 800; color: var(--wp--preset--color--purple-light); }
.prymart-stonoga-fakty span { display: block; margin-top: .5rem; font-size: .95rem; color: var(--wp--preset--color--muted); }
@media (max-width: 780px) { .prymart-stonoga-fakty { grid-template-columns: 1fr; } }

/* === Kontakt formularz === */

.prymart-contact-form .wpcf7-form input[type="text"],
.prymart-contact-form .wpcf7-form input[type="email"],
.prymart-contact-form .wpcf7-form input[type="tel"],
.prymart-contact-form .wpcf7-form textarea {
	width: 100%;
	padding: .95rem 1.15rem;
	border: 1.5px solid color-mix(in srgb, var(--wp--preset--color--dark) 12%, transparent);
	border-radius: 16px;
	background: var(--wp--preset--color--white);
	font-family: inherit;
	font-size: 1rem;
	transition: var(--prymart-transition);
}
.prymart-contact-form .wpcf7-form input:focus,
.prymart-contact-form .wpcf7-form textarea:focus {
	outline: none;
	border-color: var(--wp--preset--color--purple);
	box-shadow: 0 0 0 4px color-mix(in srgb, var(--wp--preset--color--purple) 18%, transparent);
}
.prymart-contact-form .wpcf7-form textarea { min-height: 140px; resize: vertical; }
.prymart-contact-form .wpcf7-form .wpcf7-submit {
	background: var(--wp--preset--color--purple);
	color: var(--wp--preset--color--dark);
	border: none;
	padding: .95rem 2rem;
	border-radius: 999px;
	font-weight: 700;
	cursor: pointer;
	transition: var(--prymart-transition);
}
.prymart-contact-form .wpcf7-form .wpcf7-submit:hover {
	background: var(--wp--preset--color--purple-dark);
	color: var(--wp--preset--color--white);
}
.prymart-contact-form .wpcf7-form-control-wrap { display: block; margin-bottom: 1rem; }

/* In dark sections, invert form colors */
.prymart-section-dark .prymart-contact-form .wpcf7-form input[type="text"],
.prymart-section-dark .prymart-contact-form .wpcf7-form input[type="email"],
.prymart-section-dark .prymart-contact-form .wpcf7-form input[type="tel"],
.prymart-section-dark .prymart-contact-form .wpcf7-form textarea {
	background: rgba(255, 255, 255, .08);
	border-color: rgba(255, 255, 255, .25);
	color: var(--wp--preset--color--white);
}
.prymart-section-dark .prymart-contact-form .wpcf7-form input::placeholder,
.prymart-section-dark .prymart-contact-form .wpcf7-form textarea::placeholder {
	color: rgba(255, 255, 255, .55);
}
/* Komunikat CF7 po wyslaniu: wtyczka daje sama ramke (zielona = sent,
   czerwona = blad), a kolor tekstu dziedziczy — w ciemnej sekcji byl ciemny
   na ciemnym, czyli „puste okienko" pod formularzem. */
.prymart-contact-form .wpcf7-response-output {
	margin: 1.5rem 0 0;
	padding: .9rem 1.1rem;
	border-radius: 12px;
	border-width: 1px;
	font-size: 1rem;
	line-height: 1.5;
}
.prymart-section-dark .prymart-contact-form .wpcf7-response-output {
	color: var(--wp--preset--color--white);
	background: rgba(255, 255, 255, .06);
}
.prymart-section-dark .prymart-contact-form .wpcf7-not-valid-tip { color: #ff8a8a; }

.prymart-section-dark .prymart-contact-form label {
	display: block;
	color: rgba(255, 255, 255, .9);
	font-weight: 600;
	font-size: 0.9rem;
	margin-bottom: .35rem;
}

/* === Play button === */

.prymart-play-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 84px;
	height: 84px;
	border-radius: 50%;
	background: var(--wp--preset--color--white);
	box-shadow: 0 0 0 6px color-mix(in srgb, var(--wp--preset--color--white) 12%, transparent);
	cursor: pointer;
	transition: var(--prymart-transition);
}
.prymart-play-btn:hover {
	transform: scale(1.05);
	background: var(--wp--preset--color--purple);
}
.prymart-play-btn::after {
	content: "";
	width: 0; height: 0;
	border-style: solid;
	border-width: 12px 0 12px 18px;
	border-color: transparent transparent transparent var(--wp--preset--color--dark);
	margin-left: 4px;
}

/* === Footer typography & elements === */

.prymart-footer { position: relative; }

.prymart-footer::before {
	content: "";
	position: absolute;
	inset: 0 0 auto 0;
	height: 1px;
	background: linear-gradient(90deg, transparent, rgba(165, 106, 240, .35), transparent);
}

.prymart-footer__h {
	font-size: 0.85rem !important;
	font-weight: 700 !important;
	letter-spacing: 0.12em !important;
	text-transform: uppercase !important;
	color: var(--wp--preset--color--purple) !important;
	margin: 0 0 0.25rem 0 !important;
}

.prymart-footer__tagline {
	color: rgba(255, 255, 255, .65) !important;
	max-width: 28ch;
}

.prymart-footer__addr {
	color: rgba(255, 255, 255, .82);
}
.prymart-footer__addr strong { color: var(--wp--preset--color--white); }

.prymart-footer__nav { padding: 0; list-style: none; }
.prymart-footer__nav li { margin: 0 !important; padding: 0; }
.prymart-footer__nav a {
	color: rgba(255, 255, 255, .82);
	text-decoration: none;
	padding: 0.35rem 0 0.35rem 0.5rem;
	display: inline-flex;
	align-items: center;
	position: relative;
	transition: var(--prymart-transition);
}
.prymart-footer__nav a::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	margin-top: -0.75px;
	width: 16px;
	height: 1.5px;
	background: var(--wp--preset--color--purple);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 200ms ease;
}
.prymart-footer__nav a:hover {
	color: var(--wp--preset--color--white);
}
.prymart-footer__nav a:hover::before { transform: scaleX(1); }

.prymart-footer__sep { border: 0; height: 1px !important; }

.prymart-footer__copy {
	color: rgba(255, 255, 255, .5) !important;
	margin: 0 !important;
}

/* === Page-level spacing === */

.wp-block-group.has-dark-background-color {
	color: var(--wp--preset--color--white);
}
.wp-block-group.has-dark-background-color :where(h1,h2,h3,h4,h5,h6) {
	color: var(--wp--preset--color--white);
}

/* ============================================================
   PRZEBUDOWA 2026-07-25 — repertuar, kafle, okazje, karty, nav
   ============================================================ */

/* === Nawigacja w headerze — przebudowa 2026-08-06: usunieto "Oferta" i CTA
   "Zapytaj o termin"; zostaly 4 pozycje jako pigulki, wysrodkowane przez
   grid 1fr auto 1fr na .prymart-header__inner === */
.prymart-header__inner {
	display: grid !important;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
}
.prymart-header__inner > .prymart-logo { justify-self: start; margin: 0; }
.prymart-nav {
	justify-self: center;
	display: flex;
	gap: .5rem;
	flex-wrap: wrap;
	align-items: center;
}
.prymart-nav a {
	padding: .6rem 1.15rem;
	border-radius: 999px;
	font-weight: 700;
	text-decoration: none;
	color: var(--wp--preset--color--text);
	border: 1px solid color-mix(in srgb, var(--wp--preset--color--text) 12%, transparent);
	transition: background .18s, color .18s, border-color .18s;
}
.prymart-nav a:hover {
	background: var(--wp--preset--color--purple-dark);
	border-color: var(--wp--preset--color--purple-dark);
	color: #fff;
}
@media (max-width: 900px) {
	.prymart-header__inner { grid-template-columns: 1fr; justify-items: center; gap: 1rem; }
}

/* === Buttony okazji (home) === */
.prymart-okazje {
	display: flex;
	flex-wrap: wrap;
	gap: 0.7rem;
	justify-content: center;
}
.prymart-okazje a {
	display: inline-flex;
	align-items: center;
	padding: 0.6rem 1.15rem;
	border-radius: 999px;
	background: var(--wp--preset--color--off-white);
	border: 1.5px solid color-mix(in srgb, var(--wp--preset--color--dark) 10%, transparent);
	color: var(--wp--preset--color--dark);
	font-weight: 600;
	font-size: 0.95rem;
	text-decoration: none;
	transition: var(--prymart-transition);
}
.prymart-okazje a:hover {
	background: var(--wp--preset--color--purple);
	border-color: var(--wp--preset--color--purple);
	color: var(--wp--preset--color--dark);
	transform: translateY(-1px);
}

/* === Kafle oferty (home) === */
.prymart-kafle {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1.25rem;
}
@media (min-width: 720px)  { .prymart-kafle { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1040px) { .prymart-kafle { grid-template-columns: repeat(5, 1fr); } }

.prymart-kafel {
	position: relative;
	display: block;
	aspect-ratio: 3 / 4;
	border-radius: var(--prymart-radius-lg);
	overflow: hidden;
	text-decoration: none;
	background: var(--wp--preset--color--dark);
	box-shadow: 0 18px 40px -22px rgba(15,16,24,.55);
	transition: var(--prymart-transition);
}
.prymart-kafel:hover { transform: translateY(-4px); box-shadow: 0 26px 55px -22px rgba(165,106,240,.5); }
.prymart-kafel img {
	position: absolute; inset: 0;
	width: 100%; height: 100%;
	object-fit: cover;
	transition: transform 400ms cubic-bezier(.4,0,.2,1), filter var(--prymart-transition);
	filter: brightness(.72) saturate(1.05);
}
.prymart-kafel:hover img { transform: scale(1.06); filter: brightness(.6) saturate(1.15); }
.prymart-kafel::after {
	content: "";
	position: absolute; inset: 0;
	background: linear-gradient(to top, rgba(15,16,24,.85) 0%, rgba(15,16,24,.15) 55%, transparent 100%);
}
.prymart-kafel__label {
	position: absolute;
	left: 1rem; right: 1rem; bottom: 1rem;
	z-index: 1;
	color: #fff;
	font-weight: 800;
	font-size: 1.15rem;
	letter-spacing: -0.01em;
	line-height: 1.15;
	display: flex;
	align-items: center;
	gap: .4rem;
}
.prymart-kafel__label::after {
	content: "→";
	opacity: 0;
	transform: translateX(-4px);
	transition: var(--prymart-transition);
	color: var(--wp--preset--color--purple-light);
}
.prymart-kafel:hover .prymart-kafel__label::after { opacity: 1; transform: translateX(0); }

/* === Karty archiwum (query loop) === */
ul.prymart-cards.wp-block-post-template,
.prymart-cards.wp-block-post-template {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(1, 1fr);
	gap: 2rem;
}
@media (min-width: 640px)  { ul.prymart-cards.wp-block-post-template { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1000px) { ul.prymart-cards.wp-block-post-template { grid-template-columns: repeat(3, 1fr); } }

/* równa wysokość kart w rzędzie: li = flex (grid item stretchuje się do wysokości rzędu),
   karta = zwykły blok wypełniający li przez align-items:stretch */
ul.prymart-cards.wp-block-post-template > li {
	display: flex;
	margin-top: 0 !important;        /* WP dokłada blockGap jako margin-top do rodzeństwa — psuje oś w gridzie */
	margin-block-start: 0 !important;
}
.prymart-card {
	background: var(--wp--preset--color--white);
	border: 1px solid color-mix(in srgb, var(--wp--preset--color--dark) 8%, transparent);
	border-radius: var(--prymart-radius-lg);
	overflow: hidden;
	transition: var(--prymart-transition);
	width: 100%;
}
.prymart-card:hover { transform: translateY(-4px); box-shadow: 0 22px 48px -24px rgba(15,16,24,.4); border-color: color-mix(in srgb, var(--wp--preset--color--purple) 30%, transparent); }
.prymart-card__img { margin: 0 !important; }
.prymart-card__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.prymart-card > .prymart-card__grupa,
.prymart-card > .prymart-card__title,
.prymart-card > .prymart-card__excerpt {
	padding-inline: 1.35rem;
}
.prymart-card__grupa {
	margin: 1.1rem 0 0 !important;
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}
.prymart-card__grupa a { color: var(--wp--preset--color--purple-dark); text-decoration: none; }
.prymart-card__title { margin: 0.4rem 0 0 !important; font-size: 1.3rem; line-height: 1.25; min-height: 3.25rem; }
.prymart-card__title a { color: var(--wp--preset--color--dark); text-decoration: none; }
.prymart-card__title a:hover { color: var(--wp--preset--color--purple-dark); }
.prymart-card__excerpt {
	margin: 0.6rem 0 1.4rem !important;
	color: var(--wp--preset--color--muted);
	font-size: 0.98rem;
	line-height: 1.6;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: calc(0.98rem * 1.6 * 3);
}

/* === Archiwum — nagłówek === */
.prymart-archive__head { padding-bottom: 2.5rem; }
.prymart-archive__desc {
	max-width: 680px;
	margin: 1rem auto 0;
	color: var(--wp--preset--color--muted);
	font-size: 1.12rem;
	line-height: 1.7;
}
.prymart-archive__q { margin-top: 0.5rem; }

/* === Single pozycji === */
.prymart-single__img img { width: 100%; height: 100%; object-fit: cover; }
.prymart-single__eyebrow a { color: var(--wp--preset--color--purple) !important; text-decoration: none; }
.prymart-single__grupa a { color: rgba(255,255,255,.7); text-decoration: none; }
.prymart-single__grupa a:hover { color: var(--wp--preset--color--purple-light); }

/* Akapit wprowadzajacy nad pierwszym naglowkiem opisu — skala jak lead
   paragrafy gdzie indziej w motywie (hero, Stonoga, "Poznajmy się"). */
.prymart-single__lead {
	font-size: 1.05rem;
	line-height: 1.7;
	color: var(--wp--preset--color--muted);
	margin-bottom: 0.5rem;
}

/* Sekcje treści single: nagłówki H2/H3 z opisu */
.prymart-single__body h2 {
	font-size: clamp(1.5rem, 2.6vw, 2rem);
	margin-top: 2.5rem;
	position: relative;
	padding-left: 1rem;
}
.prymart-single__body h2::before {
	content: "";
	position: absolute; left: 0; top: 0.15em; bottom: 0.15em;
	width: 4px; border-radius: 4px;
	background: var(--wp--preset--color--purple);
}
.prymart-single__body h2:first-child { margin-top: 0; }
.prymart-single__body ul { padding-left: 1.2rem; }
.prymart-single__body li { margin: 0.35rem 0; }

/* === Sekcja zespół / Patrycja (home) === */
.prymart-team__lead {
	display: grid;
	gap: 2.5rem;
	align-items: center;
}
@media (min-width: 880px) { .prymart-team__lead { grid-template-columns: 0.85fr 1.15fr; } }
.prymart-team__photo img { width: 100%; border-radius: var(--prymart-radius-lg); object-fit: cover; aspect-ratio: 4/5; }
.prymart-team__p {
	display: grid;
	gap: 0.75rem;
	margin-top: 1.5rem;
}
.prymart-team__p b { color: var(--wp--preset--color--purple-dark); }

/* Oferta — rozdzielnik na grupy */
.prymart-oferta-grupa h2 { font-size: clamp(2rem, 4vw, 2.75rem); letter-spacing: -0.015em; }
.prymart-oferta-grupa + .prymart-oferta-grupa { padding-top: 1.5rem !important; }
.prymart-oferta-grupa .prymart-kafel__label { font-weight: 700; }
/* skok z kotwicy #dla-dzieci / #dla-doroslych nie może chować nagłówka pod headerem */
.prymart-oferta-grupa { scroll-margin-top: 6rem; }

/* Kafel bez zdjęcia — kategoria bez materiałów, uczciwy pusty stan zamiast mylącego zdjęcia */
.prymart-kafel--pusty {
	background: linear-gradient(135deg, var(--wp--preset--color--purple) 0%, var(--wp--preset--color--dark-soft) 100%);
}

/* === Kontakt — kroki współpracy === */
.prymart-kroki .prymart-krok__nr { font-size: 2.5rem; font-weight: 800; line-height: 1; margin: 0 0 .75rem; }
.prymart-kroki .prymart-krok__txt { font-size: 1.05rem; line-height: 1.6; margin: 0; }
.prymart-kroki__foto { margin-top: 3rem; }
.prymart-kroki__foto img {
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	object-position: center 35%;
	display: block;
}

/* === Kontakt — osoby === */
/* Zdjęcie biura zmniejszone do formatu banerowego (16:9) przestało pełnić rolę
   wizualnego separatora między białą sekcją kroków a sekcją off-white — granica
   #FFFFFF -> #F7F7F9 sama w sobie ma zbyt niski kontrast (~1.03:1), więc
   dokładamy dodatkowy odstęp zamiast kreski dekoracyjnej lub nowego koloru. */
.prymart-kroki { padding-bottom: 6rem !important; }
.prymart-osoby { padding-top: 6rem !important; }
.prymart-osoby__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2.5rem; margin-top: 3rem; }
.prymart-osoba { display: flex; flex-direction: column; align-items: center; text-align: center; }
.prymart-osoba img { width: 100%; max-width: 260px; aspect-ratio: 3/4; object-fit: cover; border-radius: 20px; }
.prymart-osoba__imie { font-weight: 800; font-size: 1.15rem; margin-top: 1.25rem; }
.prymart-osoba__tel { font-size: 1.05rem; margin-top: .35rem; color: var(--wp--preset--color--text); text-decoration: none; }
.prymart-osoba__mail { font-size: .95rem; margin-top: .2rem; color: var(--wp--preset--color--purple-dark); text-decoration: none; word-break: break-word; }
.prymart-osoba__tel:hover, .prymart-osoba__mail:hover { text-decoration: underline; }
@media (max-width: 860px) { .prymart-osoby__grid { grid-template-columns: 1fr; gap: 3rem; } }

/* === Ikony social w headerze (2026-08-29) — trzecia kolumna gridu
   .prymart-header__inner (1fr auto 1fr), zeby nav zostal wysrodkowany === */
.prymart-social {
	justify-self: end;
	display: flex;
	align-items: center;
	gap: .35rem;
}
.prymart-social a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: 999px;
	color: var(--wp--preset--color--text);
	border: 1px solid color-mix(in srgb, var(--wp--preset--color--text) 12%, transparent);
	transition: background .18s, color .18s, border-color .18s;
}
.prymart-social a:hover,
.prymart-social a:focus-visible {
	background: var(--wp--preset--color--purple-dark);
	border-color: var(--wp--preset--color--purple-dark);
	color: #fff;
}
.prymart-social svg { width: 19px; height: 19px; display: block; }

@media (max-width: 900px) {
	.prymart-social { justify-self: center; }
}

/* === Formularz: pole "Zapytanie dotyczy" (2026-08-29) ===
   Ukryte atrybutem hidden dopoki JS nie znajdzie ?produkt= w adresie. */
.prymart-produkt-wrap[hidden] { display: none !important; }
.prymart-produkt-wrap {
	margin-bottom: 1.25rem;
	padding: .9rem 1.1rem;
	border: 1px solid var(--wp--preset--color--purple);
	border-radius: 14px;
	background: color-mix(in srgb, var(--wp--preset--color--purple) 12%, transparent);
}
.prymart-produkt-wrap label {
	display: block;
	font-size: .8rem;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--wp--preset--color--purple);
	margin-bottom: .35rem;
}
/* Pelny kontekst w selektorze — inaczej przegrywa specyficznoscia z regula
   `.prymart-section-dark .prymart-contact-form .wpcf7-form input[type=text]`
   (0,4,1) i pole dostaje tlo oraz padding zwyklego inputa, przez co wychodzi
   poza ramke. */
.prymart-produkt-wrap input.prymart-produkt-field,
.prymart-section-dark .prymart-contact-form .wpcf7-form input.prymart-produkt-field {
	box-sizing: border-box;
	background: transparent;
	border: 0;
	border-radius: 0;
	padding: 0;
	font-size: 1.05rem;
	font-weight: 700;
	color: inherit;
	width: 100%;
	cursor: default;
}
.prymart-produkt-wrap input.prymart-produkt-field:focus,
.prymart-section-dark .prymart-contact-form .wpcf7-form input.prymart-produkt-field:focus {
	outline: none;
	border: 0;
	box-shadow: none;
}
/* CF7 owija pole w .wpcf7-form-control-wrap z dolnym marginesem — w tym boksie zbedny */
.prymart-produkt-wrap .wpcf7-form-control-wrap { margin-bottom: 0; }

/* CF7 przepuszcza tresc przez autop — w tym boksie dokladane <br> i <p>
   robia dodatkowe ~40px pustki pod wartoscia. */
.prymart-produkt-wrap br { display: none; }
.prymart-produkt-wrap p { margin: 0; }
.prymart-produkt-wrap label { margin-bottom: .3rem; }

/* Trzeci licznik ma tekst zamiast liczby ("Policzyć się nie da!") — pelny
   rozmiar cyfr rozjechalby kolumne, wiec mniejszy stopien i lamanie. */
.prymart-counter__number--tekst {
	font-size: clamp(1.5rem, 2.6vw, 2.1rem);
	line-height: 1.15;
	letter-spacing: -0.01em;
}

/* === Film YouTube (facade) === */
.prymart-yt {
	position: relative;
	aspect-ratio: 16 / 9;
	border-radius: 20px;
	overflow: hidden;
	background: var(--wp--preset--color--dark-soft);
}
.prymart-yt img,
.prymart-yt iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	border: 0;
	display: block;
}
.prymart-yt__play {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: color-mix(in srgb, #0F1018 22%, transparent);
	border: 0;
	cursor: pointer;
	transition: background .2s;
}
.prymart-yt__play:hover,
.prymart-yt__play:focus-visible { background: color-mix(in srgb, #0F1018 8%, transparent); }
.prymart-yt__play span {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 76px;
	height: 76px;
	border-radius: 999px;
	background: var(--wp--preset--color--purple);
	color: var(--wp--preset--color--dark);
	box-shadow: 0 10px 30px rgba(15, 16, 24, .35);
	transition: transform .2s;
}
.prymart-yt__play:hover span { transform: scale(1.07); }
.prymart-yt__play svg { width: 28px; height: 28px; margin-left: 4px; }
.prymart-yt.is-odtwarzany .prymart-yt__play { display: none; }
@media (prefers-reduced-motion: reduce) {
	.prymart-yt__play span, .prymart-yt__play { transition: none; }
	.prymart-yt__play:hover span { transform: none; }
}

/* Sekcja osob przeniesiona na ciemne tlo (2026-08-29, nowa kolejnosc /kontakt/) —
   mail traci swoj fiolet przez `.prymart-section-dark a`, wiec przywracamy go
   jasniejszym odcieniem, czytelnym na ciemnym. */
.prymart-section-dark .prymart-osoba__mail { color: var(--wp--preset--color--purple); }
.prymart-section-dark .prymart-osoba__tel { color: var(--wp--preset--color--white); }
/* Imie osoby to <span>, a regula bazowa dla sekcji ciemnych wymienia tylko
   naglowki, p, li, strong, em i a — bez tego span dziedziczy ciemny kolor
   i znika na ciemnym tle. */
.prymart-section-dark .prymart-osoba__imie { color: var(--wp--preset--color--white); }

/* Formularz nie siedzi juz w kolumnie 55%, wiec sam musi trzymac szerokosc. */
.prymart-contact-form { max-width: 760px; margin-inline: auto; width: 100%; }

/* Galerie (O nas, #scenaprymart) — zdjecia sa raz poziome, raz pionowe,
   a core/gallery nie wyrownuje wysokosci. Wspolny kadr 4:3. */
.prymart-galeria .wp-block-image img {
	aspect-ratio: 4 / 3;
	object-fit: cover;
	width: 100%;
	border-radius: 16px;
}
/* Pionowe zdjecie w kadrze 4:3 domyslnie tnie od srodka i zostawia glowe
   poza kadrem (O nas, zdjecie 3 — Patrycja przy biurku). Klasa na figure. */
.prymart-galeria .prymart-foto--gora img { object-position: center top; }

/* Pozycja repertuaru bez zdjecia wyrozniajacego — jedna kolumna zamiast
   polowy pustego hero (klasa z body_class w functions.php). */
.prymart-bez-foto .prymart-single__hero .wp-block-columns > .wp-block-column:last-child { display: none; }
.prymart-bez-foto .prymart-single__hero .wp-block-columns > .wp-block-column:first-child { flex-basis: 100% !important; max-width: 820px; }

/* === Galeria przesuwana (pozycje repertuaru) === */
.prymart-slider { position: relative; margin: 2.5rem 0; }
.prymart-slider__tor {
	display: flex;
	gap: 1rem;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	scrollbar-width: none;
	padding-bottom: .25rem;
}
.prymart-slider__tor::-webkit-scrollbar { display: none; }
.prymart-slider__tor figure {
	flex: 0 0 min(100%, 620px);
	scroll-snap-align: center;
	margin: 0;
}
.prymart-slider__tor img {
	width: 100%;
	aspect-ratio: 3 / 2;
	object-fit: cover;
	border-radius: 18px;
	display: block;
}
.prymart-slider__nav {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 46px;
	height: 46px;
	border-radius: 999px;
	border: 0;
	background: var(--wp--preset--color--white);
	color: var(--wp--preset--color--dark);
	box-shadow: 0 6px 20px rgba(15, 16, 24, .22);
	cursor: pointer;
	font-size: 1.6rem;
	line-height: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: opacity .18s, background .18s;
}
.prymart-slider__nav--wstecz { left: -12px; }
.prymart-slider__nav--dalej { right: -12px; }
.prymart-slider__nav:hover:not(:disabled) { background: var(--wp--preset--color--purple); }
.prymart-slider__nav:disabled { opacity: .28; cursor: default; }
.prymart-slider.bez-nawigacji .prymart-slider__nav { display: none; }
@media (max-width: 780px) {
	.prymart-slider__nav--wstecz { left: 4px; }
	.prymart-slider__nav--dalej { right: 4px; }
}
@media (prefers-reduced-motion: reduce) {
	.prymart-slider__tor { scroll-behavior: auto; }
}

/* Sekcja z filmem / kadrem zastepczym pod opisem pozycji */
.prymart-material { margin-top: 3rem; }
.prymart-material h2 { font-size: 1.6rem; margin-bottom: 1rem; }
.prymart-material img { width: 100%; border-radius: 18px; display: block; }

/* Slajdy mialy rozne wysokosci: flex domyslnie rozciaga elementy (align-items:
   stretch), wiec figure bralo wysokosc najwyzszego zdjecia, a aspect-ratio na
   samym <img> tego nie ratowalo. Kadr ustalamy na figure, obraz go wypelnia. */
.prymart-slider__tor { align-items: flex-start; }
.prymart-slider__tor figure {
	aspect-ratio: 3 / 2;
	overflow: hidden;
	border-radius: 18px;
	background: var(--wp--preset--color--off-white);
}
.prymart-slider__tor figure img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 0;
	aspect-ratio: auto;
}
/* Pionowe zdjecia w galerii (znacznik data-prymart-pion z functions.php):
   zamiast ciac 2:3 do 3:2 i gubic glowy, slajd dostaje wlasna proporcje,
   a szerokosc tak dobrana, zeby wysokosc zgadzala sie z poziomymi
   (3:2 przy 620px = 413px; 2:3 → 275px, 3:4 → 310px; procenty analogicznie). */
.prymart-slider__tor figure:has(> img[data-prymart-pion="23"]) { flex-basis: min(44.4%, 275px); aspect-ratio: 2 / 3; }
.prymart-slider__tor figure:has(> img[data-prymart-pion="34"]) { flex-basis: min(50%, 310px); aspect-ratio: 3 / 4; }

/* === Opinie na /oferta/ (pkt 10 wytycznych klienta) === */
.prymart-opinie {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
	margin-top: 3rem;
}
.prymart-opinia {
	box-sizing: border-box;   /* inaczej padding 2x24px dochodzi do flex-basis w karuzeli */
	margin: 0;
	padding: 1.6rem 1.5rem;
	background: var(--wp--preset--color--off-white);
	border-radius: 18px;
	border: 1px solid color-mix(in srgb, var(--wp--preset--color--dark) 7%, transparent);
	display: flex;
	flex-direction: column;
	gap: .8rem;
}
.prymart-opinia__gwiazdki { display: inline-flex; gap: .15rem; color: #F4B740; }
.prymart-opinia__gwiazdki svg { width: 18px; height: 18px; }
.prymart-opinia blockquote {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 1rem;
	line-height: 1.65;
}
.prymart-opinia figcaption {
	margin-top: auto;
	font-size: .85rem;
	font-weight: 700;
	letter-spacing: .03em;
	text-transform: uppercase;
	color: var(--wp--preset--color--purple-dark);
}
@media (max-width: 1000px) { .prymart-opinie { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px)  { .prymart-opinie { grid-template-columns: 1fr; } }

/* `.alignfull` liczy szerokosc z 100vw, a to wymiar RAZEM z pionowym paskiem
   przewijania — na systemach z klasycznym paskiem (Windows) sekcje pelnej
   szerokosci wystawaly o jego grubosc i strona dostawala poziomy suwak.
   `clip` zamiast `hidden`, bo nie psuje position:sticky. */
html { overflow-x: clip; }

/* Odkad filtr dokleja do obrazow width/height (potrzebne przeciw skokom ukladu),
   przegladarka bierze wysokosc z atrybutu zamiast z CSS-owego aspect-ratio —
   zdjecia osob i galerie rozjezdzaly sie na pelna wysokosc pliku.
   `:where` ma zerowa specyficznosc, wiec kazda regula motywu (marquee 60px,
   slajdy 100%) nadal wygrywa. */
:where(img[width][height]) { height: auto; }

/* === Opinie jako karuzela (3 widoczne, przewijanie strzalkami) ===
   Ten sam komponent co galerie pozycji, wiec obsluguje go prymart-slider.js.
   Bez autoprzewijania — ruch tylko na zadanie odwiedzajacego. */
.prymart-slider--opinie .prymart-slider__tor {
	align-items: stretch;          /* karty rownej wysokosci, inaczej "schodki" */
	gap: 1.5rem;
	padding: .25rem .25rem 1rem;   /* zeby cien i obramowanie kart nie byly przycinane */
}
.prymart-slider--opinie .prymart-slider__tor .prymart-opinia {
	flex: 0 0 calc((100% - 3rem) / 3);
	scroll-snap-align: start;
	/* kadr 3:2 z galerii zdjec tu nie obowiazuje */
	aspect-ratio: auto;
	overflow: visible;
	border-radius: 18px;
}
/* Przy zdjeciach strzalka moze lezec na kadrze, ale na karcie z tekstem
   zaslania slowa — dlatego tor dostaje margines, a strzalki siadaja w nim. */
/* bez border-box padding POWIEKSZA kontener ponad max-width alignwide
   (1240 + 2x58 = 1356 px) i karuzela wychodzi poza rytm strony */
.prymart-slider--opinie { box-sizing: border-box; padding-inline: 58px; }
.prymart-slider--opinie .prymart-slider__nav--wstecz { left: 0; }
.prymart-slider--opinie .prymart-slider__nav--dalej { right: 0; }

@media (max-width: 1000px) {
	.prymart-slider--opinie .prymart-slider__tor .prymart-opinia { flex-basis: calc((100% - 1.5rem) / 2); }
}
@media (max-width: 640px) {
	.prymart-slider--opinie { padding-inline: 46px; }
	.prymart-slider--opinie .prymart-slider__tor .prymart-opinia { flex-basis: 100%; }
	.prymart-slider--opinie .prymart-slider__nav { width: 40px; height: 40px; }
}