/* ==========================================================================
   Guarana PR – szablon guaranapr2026
   „Piszą ludzie. Wzmacnia AI. Decyduje doświadczenie.”
   ========================================================================== */

/* ---------- Tokeny ---------- */
:root {
	--c-green-dark: #146755;
	--c-green-deep: #0E4A3F;
	--c-green: #36B07E;          /* tylko na ciemnym tle lub jako akcent (2,7:1 na białym) */
	--c-green-pale: #B8E3D1;
	--c-green-mist: #E6F5EF;
	--c-ink: #1D1D1B;
	--c-paper: #F5F4F0;
	--c-white: #FFFFFF;
	--c-text-2: #4A5560;
	--c-on-dark: #F5F4F0;
	--c-on-dark-2: #C9D2D8;
	--c-on-dark-3: #A9B4BD;
	--c-line: #DDDAD3;
	--c-line-2: #E3E1DB;
	--c-input: #8A949C;          /* obramowanie pól: 3:1 na białym */

	/* usługi AI: kontrastowy akcent różowo-fioletowy (biały tekst ≥ 4,8:1 w całym gradiencie) */
	--c-ai-pink: #C2407F;
	--c-ai-violet: #7B45D6;
	--g-ai: linear-gradient(120deg, #C2407F 0%, #9C43AE 50%, #7B45D6 100%);
	/* gradient z logo (jasna → ciemna zieleń), ukośnie – tło za sliderem i sekcji ścieżek */
	--g-brand: linear-gradient(32deg, #36B07E 0%, #24906F 20%, #146755 48%, #0E4A3F 100%); /* jasno w lewym dolnym rogu, ciemno u góry – menu i logo zawsze na ciemnej zieleni */
	/* ten sam kierunek, ciemniejszy start – tło sekcji z tekstem bezpośrednio na gradiencie (kontrast ≥ 4,5:1) */
	--g-brand-text: linear-gradient(32deg, #19785D 0%, #146755 45%, #0E4A3F 100%);

	--f-sans: 'Poppins', 'Poppins Fallback', system-ui, -apple-system, 'Segoe UI', sans-serif;
	--f-serif: 'Newsreader', 'Newsreader Fallback', Georgia, 'Times New Roman', serif;

	--r-xl: 28px;
	--r-lg: 24px;
	--r-md: 20px;
	--r-btn: 14px;
	--r-sm: 10px;

	--container: 1280px;
	--gutter: clamp(16px, 4vw, 32px);
	--section-y: clamp(64px, 9vw, 104px);

	--ease: cubic-bezier(.2, .7, .2, 1);
}

/* ---------- Reset / podstawy ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body {
	margin: 0;
	background: var(--c-paper);
	color: var(--c-ink);
	font-family: var(--f-sans);
	font-size: 17px;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}
img, svg, video { max-width: 100%; height: auto; }
img { display: block; }
a { color: var(--c-green-dark); text-underline-offset: .18em; }
a:hover { color: var(--c-green-deep); }
button, input, select, textarea { font: inherit; color: inherit; }
h1, h2, h3, h4 { margin: 0; }
p { margin: 0; }
:focus-visible { outline: 3px solid var(--c-green); outline-offset: 3px; border-radius: 4px; }
main:focus { outline: none; }

.sr-only {
	position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.skip-link {
	position: absolute; left: 16px; top: -100px; z-index: 100;
	background: var(--c-white); color: var(--c-ink); padding: 12px 18px; border-radius: var(--r-sm);
	font-weight: 600; text-decoration: none;
}
.skip-link:focus { top: 16px; }

.container { width: 100%; max-width: var(--container); margin: 0 auto; padding-left: var(--gutter); padding-right: var(--gutter); }

/* ---------- Typografia ---------- */
.display {
	font-family: var(--f-serif); font-weight: 400;
	font-size: clamp(40px, 6vw, 68px); line-height: 1.04; letter-spacing: -0.01em;
}
.h2 {
	font-family: var(--f-serif); font-weight: 400;
	font-size: clamp(34px, 4.2vw, 48px); line-height: 1.1;
}
.h3 { font-family: var(--f-serif); font-weight: 500; font-size: clamp(24px, 2.4vw, 30px); line-height: 1.2; }
.eyebrow { font-size: 14px; letter-spacing: .14em; text-transform: uppercase; color: var(--c-green-dark); font-weight: 500; }
.lead { font-size: clamp(17px, 1.6vw, 19px); line-height: 1.55; color: var(--c-text-2); max-width: 40em; }
.muted { color: var(--c-text-2); }

/* ---------- Sekcje ---------- */
.section { padding: var(--section-y) 0; }
.section--dark { background: var(--g-brand-text); color: var(--c-on-dark); }
.section--green { background: var(--c-green-deep); color: var(--c-on-dark); }
.section--white { background: var(--c-white); }
.section--dark .eyebrow { color: #DDF1E8; }
.section--green .eyebrow { color: var(--c-green); }
.section--green .eyebrow { color: var(--c-green-pale); }
.section--dark .lead { color: #EEF3F0; }
.section--green .lead { color: #CFEBDF; }
.section--dark a:not(.btn) { color: #DDF1E8; }
.section--green a:not(.btn) { color: var(--c-green-pale); }

/* ---------- Przyciski ---------- */
.btn {
	display: inline-flex; align-items: center; justify-content: center; gap: .5em;
	min-height: 44px; padding: 14px 22px; border-radius: var(--r-btn); border: 1.5px solid transparent;
	font-weight: 600; font-size: 16px; line-height: 1.2; text-decoration: none; cursor: pointer;
	transition: background-color .2s var(--ease), color .2s var(--ease), border-color .2s var(--ease), transform .2s var(--ease);
}
.btn:active { transform: translateY(1px); }
.btn--accent { background: var(--c-green); color: var(--c-ink); border-radius: 999px; padding: 12px 20px; font-size: 15px; }
.btn--accent:hover { background: #4BC08F; color: var(--c-ink); }
.btn--dark { background: var(--c-ink); color: var(--c-on-dark); }
.btn--dark:hover { background: #33332F; color: var(--c-on-dark); }
.btn--light { background: var(--c-paper); color: var(--c-ink); }
.btn--light:hover { background: var(--c-white); color: var(--c-ink); }
.btn--outline-light { border-color: rgba(255, 255, 255, .5); background: transparent; color: var(--c-on-dark); } /* na zielonym gradiencie; transparent także dla <button> */
.btn--outline-light:hover { border-color: var(--c-on-dark); color: var(--c-on-dark); }
.btn--green { background: var(--c-green-dark); color: var(--c-white); }
.btn--green:hover { background: var(--c-green-deep); color: var(--c-white); }
.link-arrow { font-weight: 600; text-decoration: none; }
.link-arrow::after { content: ' →'; }
.link-arrow:hover { text-decoration: underline; }

/* ---------- Nagłówek ---------- */
.site-header { background: var(--c-green-deep); color: var(--c-on-dark); position: relative; z-index: 20; }
/* strona główna ze sliderem: nagłówek leży na tym samym gradiencie co slider (bez szwu) */
.is-home:has(.hero-slider) .site-header { position: absolute; top: 0; left: 0; right: 0; background: transparent; }
.is-home .hero-slider { padding-top: calc(84px + clamp(8px, 1.5vw, 20px)); }
/* podstrony z ciemną sekcją tytułową: nagłówek leży na jej gradiencie; przezroczysta ramka u góry robi miejsce na nagłówek */
body:has(#main > .section--dark:first-child) .site-header { position: absolute; top: 0; left: 0; right: 0; background: transparent; }
#main > .section--dark:first-child { border-top: 84px solid transparent; background-origin: border-box; }
.site-header__bar { display: flex; align-items: center; gap: 16px 28px; min-height: 84px; padding-top: 12px; padding-bottom: 12px; }
.brand {
	color: var(--c-white); text-decoration: none; font-weight: 600; font-size: 28px; letter-spacing: -0.02em; line-height: 1;
	margin-right: auto; white-space: nowrap;
}
.brand:hover { color: var(--c-white); }
.brand__dot { color: var(--c-green); }
.site-nav__list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 4px 28px; }
.site-nav__list a {
	color: #EEF3F0; text-decoration: none; font-size: 15px; font-weight: 500; padding: 10px 0; display: inline-block; /* 500 i jaśniej – lepiej widoczne na zieleni */
	border-bottom: 2px solid transparent;
}
.site-nav__list a:hover { color: var(--c-white); }
.site-nav__list a.is-current { color: var(--c-white); border-bottom-color: var(--c-green); }
.site-nav__cta { display: none; }
.nav-toggle {
	display: none; align-items: center; gap: 10px; min-height: 44px; padding: 8px 14px;
	background: transparent; color: var(--c-on-dark); border: 1.5px solid rgba(255, 255, 255, .45); border-radius: 999px; cursor: pointer;
	font-size: 15px; font-weight: 500;
}
.nav-toggle__icon { display: inline-grid; gap: 4px; width: 18px; }
.nav-toggle__icon i { display: block; height: 2px; background: currentColor; border-radius: 2px; transition: transform .25s var(--ease), opacity .2s; }
.nav-toggle[aria-expanded="true"] .nav-toggle__icon i:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] .nav-toggle__icon i:nth-child(2) { opacity: 0; }
.nav-toggle[aria-expanded="true"] .nav-toggle__icon i:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

@media (max-width: 1080px) {
	.site-header__cta { display: none; }
	.js .nav-toggle { display: inline-flex; }
	.js .site-nav {
		position: absolute; left: 0; right: 0; top: 100%;
		background: var(--c-green-deep); border-top: 1px solid rgba(255, 255, 255, .14);
		padding: 8px var(--gutter) 28px;
		display: none;
	}
	.js .site-nav.is-open { display: block; }
	.site-nav__list { flex-direction: column; gap: 0; }
	.site-nav__list a { display: block; padding: 14px 0; font-size: 18px; border-bottom: 1px solid rgba(255, 255, 255, .12); }
	.site-nav__list a.is-current { border-bottom-color: rgba(255, 255, 255, .12); color: #9FE0C2; }
	.site-nav__cta { display: inline-flex; margin-top: 20px; }
	.no-js .site-nav { flex-basis: 100%; }
}
@media (min-width: 1081px) {
	.site-nav { display: block; }
}

/* ---------- Pasek marek ---------- */
.brands { background: var(--c-white); border-top: 1px solid var(--c-line-2); }
.brands__in { display: flex; flex-wrap: wrap; align-items: center; gap: 24px 48px; padding-top: 40px; padding-bottom: 40px; }
.brands__heading { font-family: var(--f-sans); font-size: 14px; font-weight: 400; color: var(--c-text-2); margin-right: auto; }
.brands__list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 28px 56px; }
.brands__list a { display: block; padding: 6px; border-radius: 8px; opacity: .85; transition: opacity .2s var(--ease); }
.brands__list a:hover { opacity: 1; }
.brands__list img { height: 34px; width: auto; }
.brands__list img[src*="pasek-thaly"] { height: 29px; } /* THALY optycznie dominował – o 15% mniejsze (decyzja 23.10.2026) */

/* ---------- Stopka ---------- */
.site-footer { background: var(--c-ink); color: var(--c-on-dark-3); font-size: 14px; }
.site-footer__in { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 16px 32px; padding-top: 48px; padding-bottom: 48px; }
.site-footer__name { font-family: var(--f-serif); font-size: 20px; color: var(--c-on-dark); }
.site-footer__links { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px 28px; }
.site-footer__links li { margin: 0; }
.site-footer a { color: var(--c-green); }
.site-footer a:hover { color: var(--c-green-pale); }
.site-footer__meta { flex-basis: 100%; font-size: 13px; color: #8E99A2; }

/* ---------- Informacja o cookies ---------- */
.cookies {
	position: fixed; z-index: 50; left: 16px; right: 16px; bottom: 16px; max-width: 760px; margin: 0 auto;
	background: var(--c-white); color: var(--c-ink); border-radius: var(--r-md);
	box-shadow: 0 10px 40px rgba(13, 26, 23, .22);
	padding: 20px 24px; display: flex; flex-wrap: wrap; align-items: center; gap: 16px 24px; font-size: 14px; line-height: 1.5;
}
.cookies[hidden] { display: none; }
.cookies__text { flex: 1 1 320px; }
.cookies__title { font-weight: 600; margin-bottom: 4px; }
.cookies__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; }
.cookies__more { font-weight: 600; }

/* ---------- Strona 404 ---------- */
.error-page__in { display: flex; flex-direction: column; gap: 24px; min-height: 50vh; justify-content: center; }

/* ==========================================================================
   Treść podstron z CMS (page_content.php) – styl bazowy.
   Pełne wzory podstron (usługa / realizacja / produkt) – etap 4.
   ========================================================================== */

.page-section-main-in { width: 100%; max-width: var(--container); margin: 0 auto; padding-left: var(--gutter); padding-right: var(--gutter); }

/* Nagłówek podstrony */
.page-section-heading { background: var(--c-ink); color: var(--c-on-dark); }
.page-section-heading .page-section-main-in { padding-top: clamp(40px, 6vw, 72px); padding-bottom: clamp(40px, 6vw, 72px); display: flex; flex-direction: column-reverse; gap: 18px; }
.page-section-heading .name {
	font-family: var(--f-serif); font-weight: 400; font-size: clamp(36px, 5vw, 60px); line-height: 1.06; letter-spacing: -0.01em; max-width: 20em;
}
.page-section-heading .name em { display: block; font-family: var(--f-sans); font-style: normal; font-size: 14px; letter-spacing: .14em; text-transform: uppercase; color: var(--c-green); margin-bottom: 14px; }
.page-section-heading .name b { display: block; font-weight: 400; font-size: .5em; color: var(--c-on-dark-2); margin-top: 12px; }
.page-section-heading .back a { color: var(--c-on-dark-3); text-decoration: none; font-size: 14px; }
.page-section-heading .back a:hover { color: var(--c-on-dark); }
.page-section-heading .back span::after { content: ' '; }
.page-section-heading .back b { font-weight: 500; color: var(--c-green); }

/* Podmenu pod nagłówkiem */
.page-section-headingmenu { background: var(--c-white); border-bottom: 1px solid var(--c-line-2); }
.page-section-headingmenu ul { list-style: none; margin: 0; padding: 14px 0; display: flex; flex-wrap: wrap; gap: 8px; }
.page-section-headingmenu a { display: inline-block; padding: 8px 16px; border-radius: 999px; text-decoration: none; color: var(--c-ink); font-size: 15px; background: var(--c-paper); }
.page-section-headingmenu a:hover { background: var(--c-green-mist); }
.page-section-headingmenu .current a { background: var(--c-green-dark); color: var(--c-white); }
.page-section-headingmenu em { display: none; }

/* Komunikaty */
.page-section-messages .messages { max-width: var(--container); margin: 24px auto 0; padding: 0 var(--gutter); }
.page-section-messages .messages > div { padding: 14px 18px; border-radius: var(--r-sm); background: var(--c-green-mist); color: var(--c-green-deep); font-weight: 500; }
.page-section-messages .messages > .error { background: #FBE9E7; color: #8A1F11; }

/* Treść */
.page-section-content .page-section-main-in { padding-top: var(--section-y); padding-bottom: var(--section-y); }
.psection-cols { display: grid; gap: 32px 48px; margin-bottom: 48px; }
.psection-cols:last-child { margin-bottom: 0; }
@media (min-width: 900px) {
	.psection-cols-2 { grid-template-columns: repeat(2, 1fr); }
	.psection-cols-3 { grid-template-columns: repeat(3, 1fr); }
	.psection-cols-4 { grid-template-columns: repeat(4, 1fr); }
	.psection-col-2 { grid-column: span 2; }
	.psection-col-3 { grid-column: span 3; }
}
.psection-col { min-width: 0; display: flex; flex-direction: column; gap: 32px; }

.page-description { max-width: 46em; }
.psection-cols-2 .page-description, .psection-cols-3 .page-description, .psection-cols-4 .page-description { max-width: none; }
/* wstęp nad siatką kafelków (np. /efekty, /oferta): na szerokość siatki, nie wąskiej kolumny tekstu */
.psection-col:has(.page-module__subpages) .page-description { max-width: none; }
.page-description > * + * { margin-top: 1em; }
.page-description h1, .page-description h2 { font-family: var(--f-serif); font-weight: 400; font-size: clamp(28px, 3.2vw, 40px); line-height: 1.15; margin-top: 1.4em; }
.page-description h3 { font-family: var(--f-serif); font-weight: 500; font-size: clamp(22px, 2.2vw, 28px); line-height: 1.25; margin-top: 1.4em; }
.page-description h4, .page-description h5 { font-size: 18px; font-weight: 600; margin-top: 1.4em; }
.page-description > :first-child { margin-top: 0; }
.page-description ul, .page-description ol { padding-left: 1.3em; }
.page-description li + li { margin-top: .4em; }
.page-description li::marker { color: var(--c-green-dark); }
.page-description blockquote { margin: 1.5em 0; padding: 4px 0 4px 24px; border-left: 3px solid var(--c-green-dark); font-family: var(--f-serif); font-size: 1.25em; line-height: 1.4; }
.page-description img { border-radius: var(--r-md); height: auto !important; }
.page-description table { border-collapse: collapse; width: 100%; font-size: 15px; display: block; overflow-x: auto; }
.page-description td, .page-description th { border-bottom: 1px solid var(--c-line); padding: 10px 12px; text-align: left; vertical-align: top; }
.page-description iframe { max-width: 100%; border: 0; border-radius: var(--r-md); }
.page-description strong.zajawka1, .page-description strong.zajawka1b, .page-description strong.zajawka1c {
	display: block; font-family: var(--f-serif); font-weight: 400; font-size: clamp(22px, 2.4vw, 30px); line-height: 1.3; color: var(--c-ink);
}
.page-description strong.zajawka2, .page-description strong.zajawka2b, .page-description strong.zajawka2c {
	display: block; font-weight: 600; font-size: 19px; color: var(--c-green-dark);
}
/* Edytor TinyMCE w panelu */
.page-edit { padding: 16px; background: var(--c-white); }

/* Kafle podstron (oferta, realizacje, PR Flash, „Przeczytaj również”) */
.page-module__subpages .big-heading { font-family: var(--f-serif); font-size: clamp(28px, 3vw, 36px); margin-bottom: 24px; }
.page-module__subpages ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); gap: 24px; }
.page-module__subpages li { margin: 0 !important; }
.page-module__subpages a {
	display: flex; flex-direction: column; height: 100%; background: var(--c-white); border-radius: var(--r-md); overflow: hidden;
	text-decoration: none; color: var(--c-ink); box-shadow: 0 1px 0 var(--c-line-2);
	transition: transform .25s var(--ease), box-shadow .25s var(--ease);
}
.page-module__subpages a:hover { transform: translateY(-3px); box-shadow: 0 12px 30px rgba(13, 26, 23, .10); color: var(--c-ink); }
@media (prefers-reduced-motion: reduce) { .page-module__subpages a, .page-module__subpages a:hover { transition: none; transform: none; } }
.page-module__subpages a > i { display: block; position: relative; aspect-ratio: 2 / 1; background: var(--c-green-dark); font-style: normal; }
.page-module__subpages a > i > img { width: 100%; height: 100%; object-fit: cover; }
.page-module__subpages a > i > ins { display: none; }
.page-module__subpages a > strong { display: block; padding: 20px 22px 24px; font-weight: 400; }
.page-module__subpages a > strong span { display: flex; flex-direction: column; gap: 8px; }
.page-module__subpages a > strong b { font-family: var(--f-serif); font-weight: 500; font-size: 22px; line-height: 1.25; }
.page-module__subpages a > strong b + b { font-family: var(--f-sans); font-size: 14px; font-weight: 400; color: var(--c-green-dark); }
.page-module__subpages a > strong em { font-style: normal; font-size: 15px; line-height: 1.5; color: var(--c-text-2); }
.psection-module + .psection-module, .psection-text + .psection-module { margin-top: 8px; }

/* Galeria (siatka; powiększenie – etap 4) */
.page-module__gallery ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 200px), 1fr)); gap: 12px; }
.page-module__gallery a { display: block; border-radius: 14px; overflow: hidden; }
.page-module__gallery img { width: 100%; aspect-ratio: 1; object-fit: cover; transition: transform .4s var(--ease); }
.page-module__gallery a:hover img { transform: scale(1.03); }
.page-module__gallery b, .page-module__gallery i { display: none; }

/* Logotypy klientów (moduł partnerów) */
.page-module__partners ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 16px; }
.page-module__partners a { display: flex; align-items: center; justify-content: center; height: 110px; padding: 18px; background: var(--c-white); border-radius: 16px; pointer-events: none; }
.page-module__partners strong, .page-module__partners b, .page-module__partners em { display: contents; }
.page-module__partners .n, .page-module__partners u, .page-module__partners i { display: none; }
.page-module__partners img { max-height: 64px; width: auto; object-fit: contain; filter: grayscale(1); opacity: .8; }

/* Pas partnerów pod treścią (section_partners) – przewijany pas: etap 3 */
.page-section-partners { background: var(--c-white); padding: 40px 0; overflow: hidden; }
.page-section-partners ul { list-style: none; margin: 0 auto; padding: 0 var(--gutter); max-width: var(--container); display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 24px 48px; }
.page-section-partners a { pointer-events: none; display: block; }
.page-section-partners b, .page-section-partners em, .page-section-partners span { display: contents; }
.page-section-partners img { height: 48px; width: auto; max-width: 160px; object-fit: contain; filter: grayscale(1); opacity: .75; }
.page-section-partners .side { display: none; }

/* Sekcja „Dlaczego warto” */
.page-section-why { background: var(--c-green-deep); color: var(--c-on-dark); }
.page-section-why .section-in { max-width: var(--container); margin: 0 auto; padding: var(--section-y) var(--gutter); }
.page-section-why .page-description { max-width: 52em; }
.page-section-why .section-bg { display: none; }
.page-section-why a { color: var(--c-green-pale); }
.page-section-btn { margin-top: 28px; }
.page-section-btn a { display: inline-flex; min-height: 44px; align-items: center; padding: 14px 22px; border-radius: var(--r-btn); background: var(--c-paper); color: var(--c-ink) !important; font-weight: 600; text-decoration: none; }

/* Banery wydarzeń */
.page-section-events { background: var(--c-white); padding: 40px 0; }
.page-section-events .section-banners { max-width: var(--container); margin: 0 auto; padding: 0 var(--gutter); display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); gap: 20px; }
.page-section-events .section-banner { display: flex; flex-direction: column; text-decoration: none; color: var(--c-ink); background: var(--c-paper); border-radius: var(--r-md); overflow: hidden; }
.page-section-events .section-banner:first-child, .page-section-events .section-banner:last-child { display: none; } /* duplikaty karuzeli 2022 */
.page-section-events .section-banner img + img { display: none; }
.page-section-events .section-banner img { width: 100%; aspect-ratio: 5 / 3; object-fit: cover; }
.page-section-events .section-banner p { padding: 18px 20px; }
.page-section-events .section-banner p > span > span { display: flex; flex-direction: column; gap: 6px; }
.page-section-events .section-banner strong { font-family: var(--f-serif); font-weight: 500; font-size: 22px; }
.page-section-events .section-banner b { font-weight: 400; color: var(--c-text-2); font-size: 15px; }
.page-section-events .section-banner em { font-style: normal; font-weight: 600; color: var(--c-green-dark); }
.page-section-events .section-banner .fa, .page-section-events .section-cover, .page-section-events ins { display: none; }

/* ---------- Formularz kontaktowy (moduł CMS) ---------- */
.page-module__contact_form form { background: var(--c-white); border-radius: var(--r-lg); padding: clamp(24px, 4vw, 36px); }
.contact-form__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 18px; }
.contact-form__field { display: block; font-size: 14px; font-weight: 600; }
.contact-form__field input, .contact-form__field textarea, .contact-form__field select { display: block; margin-top: 6px; }
.contact-form__field--wide, .contact-form__rules, .contact-form__actions { grid-column: 1 / -1; }
.contact-form__field input, .contact-form__field textarea, .contact-form__field select {
	font-weight: 400; font-size: 16px; padding: 14px; border: 1px solid var(--c-input); border-radius: var(--r-sm); background: var(--c-white); width: 100%;
}
.contact-form__field textarea { min-height: 140px; resize: vertical; }
.contact-form__field input:focus, .contact-form__field textarea:focus { border-color: var(--c-green-dark); outline: 2px solid var(--c-green-dark); outline-offset: 0; }
.contact-form__optional { font-weight: 400; color: var(--c-text-2); }
.contact-form__rules { display: flex; gap: 12px; align-items: flex-start; font-size: 13px; line-height: 1.5; color: var(--c-text-2); }
.contact-form__rules input { width: 20px; height: 20px; margin: 1px 0 0; flex: 0 0 auto; accent-color: var(--c-green-dark); }
.contact-form__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; }
.contact-form__status { font-size: 15px; font-weight: 500; }
.contact-form__status.is-error { color: #A3261A; }
.contact-form__status.is-success { color: var(--c-green-dark); }
.hp-field { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* Elementy dekoracyjne starego szablonu, które mogą zostać w treściach */
.page-section-nowhy, #remtest { display: none; }

/* Nagłówki kategorii w module podstron (np. Studia Robocze / oferta) */
.page-module__subpages .heading { margin: 56px 0 24px; }
.page-module__subpages .heading:first-child { margin-top: 0; }
.page-module__subpages .heading strong { display: flex; flex-direction: column; gap: 6px; font-weight: 400; }
.page-module__subpages .heading .s1 { font-size: 14px; letter-spacing: .14em; text-transform: uppercase; color: var(--c-green-dark); font-weight: 500; }
.page-module__subpages .heading .s2 { font-family: var(--f-serif); font-weight: 400; font-size: clamp(28px, 3.2vw, 40px); line-height: 1.15; }
.page-module__subpages .heading i { display: none; }
.page-module__subpages .heading.line { border-top: 1px solid var(--c-line); margin: 48px 0 32px; }
.page-module__subpages a > strong em { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }

@media (max-width: 640px) {
	.cookies { padding: 16px 18px; font-size: 13px; gap: 12px; }
	.cookies__text p:not(.cookies__title) { max-height: 6.2em; overflow-y: auto; }
	.cookies__actions { width: 100%; }
	.cookies__accept { flex: 1 1 auto; }
}

/* Hasło dostępu do serwisu (401) */
.site-password { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; max-width: 520px; }
.site-password label { flex-basis: 100%; font-size: 14px; font-weight: 600; }
.site-password input { flex: 1 1 220px; min-height: 48px; padding: 12px 14px; border-radius: var(--r-sm); border: 1px solid #5E6B75; background: #2A2A27; color: var(--c-on-dark); }
.site-password__error { flex-basis: 100%; color: #FFB4A8; }

/* ==========================================================================
   Strona główna (tpl/home.php)
   ========================================================================== */
.btn-row { display: flex; flex-wrap: wrap; gap: 14px; }
.btn-row .btn { padding: 16px 22px; }
.btn--block { width: 100%; padding: 18px 24px; font-size: 17px; text-align: center; }
.section-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 16px 32px; margin-bottom: 40px; }
.section-head > div { display: flex; flex-direction: column; gap: 10px; }
.section-head__lead { max-width: 460px; font-size: 17px; line-height: 1.55; color: var(--c-text-2); }
.section-head .link-arrow { font-size: 16px; }

/* 1. Otwarcie */
.home-hero { background: var(--c-ink); color: var(--c-on-dark); }
.home-hero__in { display: flex; flex-wrap: wrap; gap: 48px; align-items: stretch; padding-top: clamp(32px, 5vw, 56px); padding-bottom: clamp(48px, 6vw, 72px); }
.home-hero__text { flex: 1 1 520px; min-width: 0; display: flex; flex-direction: column; justify-content: center; gap: 28px; }
.home-hero .eyebrow { color: var(--c-green); }
.home-hero__title em { color: var(--c-green); }
.home-hero .lead { color: var(--c-on-dark-2); max-width: 540px; }
.home-hero__note { font-size: 14px; color: var(--c-on-dark-3); }
.home-hero__media { flex: 1 1 440px; min-width: 0; margin: 0; min-height: clamp(320px, 45vw, 560px); border-radius: var(--r-xl); background: var(--c-green-dark); position: relative; overflow: hidden; }
.home-hero__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 42% center; }

/* 2. Manifest */
.home-manifest .container { max-width: 1080px; padding-top: clamp(64px, 9vw, 96px); padding-bottom: clamp(40px, 6vw, 72px); text-align: center; }
.home-manifest__text { font-family: var(--f-serif); font-size: clamp(26px, 3.4vw, 40px); line-height: 1.25; }
.home-manifest__text .hl { color: var(--c-green-dark); }
.home-manifest__text mark { background: var(--c-green-pale); color: inherit; padding: 0 8px; border-radius: 8px; -webkit-box-decoration-break: clone; box-decoration-break: clone; }

/* 3. Proces */
.home-process { padding: 24px 0 var(--section-y); }
.process-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 24px; }
.process-card { background: var(--c-white); border-radius: var(--r-lg); overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 1px 0 #E2E0DA; }
.process-card__media { height: 220px; position: relative; background: var(--c-green-dark); }
.process-card--2 .process-card__media { background: var(--c-green-deep); }
.process-card--3 .process-card__media { background: var(--c-ink); }
.process-card__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
/* miękkie przyciemnienie pod numerem etapu – czytelny także na jasnych zdjęciach */
.process-card__media::after { content: ""; position: absolute; inset: 0; background: radial-gradient(180px 140px at 0 0, rgba(13, 26, 23, .55), transparent 75%); pointer-events: none; }
.process-card__nr { position: absolute; z-index: 1; top: 18px; left: 22px; font-family: var(--f-serif); font-size: 64px; line-height: 1; color: var(--c-green-pale); text-shadow: 0 1px 12px rgba(13, 26, 23, .35); }
.process-card__body { padding: 28px; display: flex; flex-direction: column; gap: 18px; flex-grow: 1; }
.process-card__body .h3 { margin-bottom: 6px; }
.process-card__q { font-size: 17px; color: var(--c-text-2); }
.process-card__roles { margin: 0; display: flex; flex-direction: column; gap: 12px; font-size: 15px; line-height: 1.5; }
.process-card__roles dt { font-weight: 600; color: var(--c-green-dark); }
.process-card__roles .role--experience dt { color: var(--c-ink); }
.process-card__roles dd { margin: 0; }
.process-card__link {
	margin-top: auto; display: flex; justify-content: space-between; align-items: center; gap: 12px;
	padding: 16px 18px; min-height: 44px; background: var(--c-green-mist); border-radius: var(--r-btn);
	text-decoration: none; color: var(--c-green-deep); font-weight: 600; transition: background-color .2s var(--ease);
}
.process-card__link:hover { background: #D3EEE3; color: var(--c-green-deep); }
.home-process__note { margin-top: 40px; font-size: 15px; color: var(--c-text-2); text-align: center; }

/* 4. Dwie ścieżki */
.home-paths { background: var(--g-brand); }
.home-paths__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); gap: 24px; padding-top: var(--section-y); padding-bottom: var(--section-y); }
.path-card {
	position: relative; overflow: hidden; border-radius: var(--r-xl); min-height: clamp(360px, 40vw, 440px);
	display: flex; flex-direction: column; justify-content: flex-end; padding: clamp(24px, 3vw, 36px);
	background: var(--c-green-dark); color: var(--c-on-dark) !important; text-decoration: none;
}
.path-card--2 { background: var(--c-green-deep); }
.path-card > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--ease); }
.path-card:hover > img { transform: scale(1.03); }
.path-card__shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(13, 26, 23, 0) 12%, rgba(13, 26, 23, .62) 42%, rgba(13, 26, 23, .92) 72%); }
.path-card__body { position: relative; display: flex; flex-direction: column; gap: 14px; }
.path-card__eyebrow { font-size: 13px; letter-spacing: .14em; text-transform: uppercase; color: var(--c-green-pale); }
.path-card__title { font-family: var(--f-serif); font-size: clamp(30px, 3.4vw, 40px); line-height: 1.1; }
.path-card__text { font-size: 17px; line-height: 1.55; color: var(--c-on-dark-2); max-width: 480px; }
.path-card--2 .path-card__text { color: #CFEBDF; }
.path-card__more { font-weight: 600; font-size: 16px; }
.path-card:hover .path-card__more { text-decoration: underline; text-underline-offset: .18em; }

/* 5. Studia Robocze */
.home-studios { padding: var(--section-y) 0; }
.studio-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 20px; }
.studio-card { height: 100%; display: flex; flex-direction: column; background: var(--c-white); border-radius: var(--r-md); overflow: hidden; text-decoration: none; color: var(--c-ink); transition: transform .25s var(--ease), box-shadow .25s var(--ease); }
.studio-card:hover { color: var(--c-ink); transform: translateY(-3px); box-shadow: 0 12px 30px rgba(13, 26, 23, .10); }
.studio-card--highlight { outline: 2px solid var(--c-green-dark); outline-offset: -2px; }
.studio-card img { width: 100%; height: 150px; object-fit: cover; }
.studio-card__body { padding: 20px; display: flex; flex-direction: column; gap: 8px; }
.studio-card__name { font-family: var(--f-serif); font-weight: 500; font-size: 24px; line-height: 1.2; }
.studio-card__desc { font-size: 14px; line-height: 1.5; color: var(--c-text-2); }
.home-studios__industries { margin-top: 40px; font-size: 15px; color: var(--c-text-2); }
/* Branże pod Studiami Roboczymi – wariant „redakcyjny”: nagłówek po lewej, lista z liniami po prawej */
.home-industries { margin-top: 24px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 24px 40px; padding: clamp(24px, 3vw, 32px) clamp(24px, 3vw, 36px); border-radius: var(--r-md); background: var(--c-green-mist); }
.home-industries__title { margin: 8px 0 0; font-family: var(--f-serif); font-weight: 400; font-size: clamp(26px, 2.6vw, 30px); line-height: 1.12; }
.home-industries__text { margin: 12px 0 0; font-size: 15px; line-height: 1.5; color: var(--c-text-2); }
.home-industries__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; column-gap: 32px; align-content: center; }
.home-industries__list a, .home-industries__list span { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 18px 0; border-bottom: 1px solid rgba(20, 103, 85, .22); color: var(--c-ink); text-decoration: none; font-family: var(--f-serif); font-weight: 700; font-size: 21px; line-height: 1.2; }
.home-industries__list a span { padding: 0; border: 0; font-family: var(--f-sans); font-weight: 600; color: var(--c-green-dark); transition: transform .2s; }
.home-industries__list a:hover { color: var(--c-green-dark); }
.home-industries__list a:hover span { transform: translateX(4px); }
.home-industries__list a:focus-visible { outline: 2px solid var(--c-green-dark); outline-offset: 2px; }
@media (max-width: 860px) { .home-industries { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .home-industries__list { grid-template-columns: 1fr; } }

/* 6. Realizacje */
.case-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: 32px 24px; }
.case-card { display: flex; flex-direction: column; gap: 14px; text-decoration: none; color: var(--c-ink); }
.case-card:hover { color: var(--c-ink); }
.case-card img { width: 100%; height: 300px; object-fit: cover; border-radius: var(--r-md); transition: transform .5s var(--ease); }
.case-card:hover img { transform: scale(1.02); }
.case-card__meta { font-size: 14px; color: var(--c-green-dark); }
.case-card__title { font-family: var(--f-serif); font-weight: 500; font-size: 24px; line-height: 1.2; }
.case-card:hover .case-card__title { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .15em; }
.case-card__teaser { font-size: 15px; line-height: 1.5; color: var(--c-text-2); }

/* 7. Pas zaufania */
.home-trust { padding: clamp(64px, 9vw, 96px) 0; }
.stats { margin: 0 0 56px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 24px; }
.stat { border-top: 1px solid var(--c-ink); padding-top: 18px; }
.stat__value { font-family: var(--f-serif); font-size: clamp(44px, 5vw, 56px); line-height: 1; }
.stat__label { margin: 8px 0 0; font-size: 15px; color: var(--c-text-2); }
.clients { display: flex; flex-direction: column; gap: 20px; }
.clients__intro { font-size: 15px; color: var(--c-text-2); }
.clients__intro a { margin-left: .4em; }

.marquee { position: relative; border-top: 1px solid var(--c-line); border-bottom: 1px solid var(--c-line); }
/* Logotypy JPG mają białe tło: mix-blend-mode: multiply „wtapia” je w beżowe tło strony.
   Bez mask-image (izoluje warstwę i psuje mieszanie) – wygaszenie brzegów robią gradienty w kolorze tła. */
.marquee__viewport { position: relative; overflow: hidden; display: flex; padding: 26px 0; background: var(--c-paper); }
.marquee__viewport::before, .marquee__viewport::after { content: ''; position: absolute; z-index: 1; top: 0; bottom: 0; width: 6%; pointer-events: none; }
.marquee__viewport::before { left: 0; background: linear-gradient(90deg, var(--c-paper), rgba(245, 244, 240, 0)); }
.marquee__viewport::after { right: 0; background: linear-gradient(270deg, var(--c-paper), rgba(245, 244, 240, 0)); }
.marquee__track { list-style: none; margin: 0; padding: 0 36px 0 0; display: flex; align-items: center; gap: 72px; flex: 0 0 auto; animation: marquee calc(var(--items, 24) * 2.4s) linear infinite; }
.marquee__track li { flex: 0 0 auto; }
.marquee__track { mix-blend-mode: multiply; } /* na całym pasie: animowany transform tworzy osobną grupę */
.marquee__track img { height: 52px; width: auto; max-width: 180px; object-fit: contain; filter: grayscale(1) contrast(1.05); opacity: .8; }
/* pas przewija się cały czas; zatrzymuje się tylko po najechaniu myszą (decyzja właściciela 21.10 – bez przycisku pauzy) */
.marquee:hover .marquee__track { animation-play-state: paused; }
@keyframes marquee { to { transform: translateX(-100%); } }
@media (prefers-reduced-motion: reduce) {
	.marquee__track { animation: none; flex-wrap: wrap; justify-content: center; gap: 32px 56px; padding: 0; flex: 1 1 auto; }
	.marquee__track--copy { display: none; }
	.marquee__viewport::before, .marquee__viewport::after { display: none; }
}

/* 8. AI Visibility */
.home-ai__in { display: flex; flex-wrap: wrap; gap: 40px; align-items: center; padding-top: clamp(64px, 8vw, 88px); padding-bottom: clamp(64px, 8vw, 88px); }
.home-ai { background: var(--c-green-deep); color: var(--c-on-dark); }
.home-ai__text { flex: 1 1 520px; min-width: 0; display: flex; flex-direction: column; gap: 20px; }
.home-ai .h2 { font-size: clamp(32px, 4vw, 46px); }
.home-ai .lead { color: #CFEBDF; max-width: 560px; }
.home-ai__cta { flex: 1 1 360px; min-width: 0; display: flex; flex-direction: column; gap: 14px; }
.home-ai__cta .btn { color: var(--c-green-deep); }
.home-ai__note { font-size: 14px; color: var(--c-green-pale); text-align: center; }

/* 9. Brief */
.home-brief { padding: var(--section-y) 0; }
.home-brief:focus { outline: none; }
.home-brief__in { display: flex; flex-wrap: wrap; gap: 56px; }
.home-brief__text { flex: 1 1 380px; min-width: 0; display: flex; flex-direction: column; gap: 18px; }
.home-brief__form { flex: 1 1 560px; min-width: 0; }
.home-brief__form .page-section-messages .messages { padding: 0; margin: 0 0 16px; }

@media (prefers-reduced-motion: reduce) {
	.path-card > img, .case-card img, .studio-card { transition: none !important; transform: none !important; }
}

/* ==========================================================================
   Podstrony (tpl/_layout.php): usługa, realizacja, produkt, artykuł, zwykła
   ========================================================================== */
.btn--lg { padding: 16px 26px; font-size: 16px; }

/* Ścieżka okruszków */
.crumbs ol { list-style: none; margin: 0 0 28px; padding: 0; display: flex; flex-wrap: wrap; gap: 4px 0; font-size: 14px; }
.crumbs li + li::before { content: '/'; margin: 0 10px; color: #6E7A84; }
.crumbs a { color: var(--c-on-dark-3); text-decoration: none; }
.crumbs a:hover { color: var(--c-on-dark); text-decoration: underline; }
.crumbs [aria-current] { color: var(--c-on-dark); }
.page-hero--case .crumbs a, .article .crumbs a { color: var(--c-text-2); }
.page-hero--case .crumbs a:hover, .article .crumbs a:hover { color: var(--c-ink); }
.page-hero--case .crumbs li + li::before, .article .crumbs li + li::before { color: #9AA3AA; }
.page-hero--case .crumbs [aria-current], .article .crumbs [aria-current] { color: var(--c-ink); }

/* Otwarcie podstrony */
.page-hero { padding: clamp(28px, 4vw, 44px) 0 clamp(48px, 6vw, 72px); }
.page-hero__in { display: flex; flex-wrap: wrap; gap: 48px; align-items: stretch; }
.page-hero__text { flex: 1 1 520px; min-width: 0; display: flex; flex-direction: column; justify-content: center; gap: 24px; }
.page-hero__in--noimg .page-hero__text { max-width: 860px; }
.page-hero__title { font-family: var(--f-serif); font-weight: 400; font-size: clamp(38px, 5vw, 60px); line-height: 1.06; letter-spacing: -0.01em; }
.page-hero .lead { color: var(--c-on-dark-2); max-width: 620px; }
.page-hero__media { flex: 1 1 420px; min-width: 0; margin: 0; min-height: clamp(260px, 36vw, 460px); border-radius: var(--r-xl); background: var(--c-green-dark); position: relative; overflow: hidden; }
.page-hero__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.page-hero--simple .page-hero__title { max-width: 18em; }
.page-hero--simple .page-hero__title + .lead, .page-hero--simple .eyebrow + .page-hero__title { margin-top: 16px; }
.page-hero--simple .lead + .btn-row { margin-top: 24px; }
.badge {
	display: table; margin-bottom: 14px; padding: 5px 12px; border-radius: 999px;
	font-family: var(--f-sans); font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase;
	background: #F3D9A4; color: #4A3200;
}

/* Pasek etapów produktu */
.stagebar ol { list-style: none; margin: 0 0 36px; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.stagebar a {
	display: block; padding: 12px 16px; border-radius: var(--r-btn); border: 1.5px solid #3B3B37;
	color: var(--c-on-dark-3); text-decoration: none; font-weight: 500; font-size: 15px; text-align: center;
}
.stagebar a:hover { color: var(--c-on-dark); border-color: #5E6B75; }
.stagebar a[aria-current] { background: var(--c-green); border-color: var(--c-green); color: var(--c-ink); font-weight: 600; }
.stagebar__nr { opacity: .7; }

/* Realizacja: nagłówek, metryczka, duże zdjęcie */
.page-hero--case { background: var(--c-paper); padding-bottom: 0; }
.case-head { display: grid; gap: 28px 64px; align-items: end; }
@media (min-width: 960px) { .case-head { grid-template-columns: minmax(0, 1.6fr) minmax(260px, 1fr); } }
.case-head__title { font-family: var(--f-serif); font-weight: 400; font-size: clamp(36px, 4.6vw, 56px); line-height: 1.08; }
.case-meta { margin: 0; display: grid; grid-template-columns: auto 1fr; gap: 10px 20px; font-size: 15px; border-top: 1px solid var(--c-ink); padding-top: 18px; }
.case-meta > div { display: contents; }
.case-meta dt { color: var(--c-text-2); }
.case-meta dd { margin: 0; font-weight: 500; }
.case-figure { margin: clamp(32px, 4vw, 48px) auto 0; }
.case-figure img { width: 100%; max-height: 720px; object-fit: cover; border-radius: var(--r-xl); }
.case-figure figcaption { margin-top: 12px; font-size: 14px; color: var(--c-text-2); }

/* Pasek liczb */
.numbers { padding: clamp(40px, 5vw, 64px) 0; }
.numbers__grid { margin: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); gap: 24px; }
.numbers__item { border-top: 1px solid var(--c-ink); padding-top: 16px; }
.numbers__item dt { font-family: var(--f-serif); font-size: clamp(40px, 4.4vw, 56px); line-height: 1; color: var(--c-green-dark); }
.numbers__item dd { margin: 8px 0 0; font-size: 15px; color: var(--c-text-2); }

/* Treść z edytora */
.page-body { padding: var(--section-y) 0; }
.page-hero + .page-body, .numbers + .page-body, .subnav + .page-body { padding-top: clamp(48px, 6vw, 72px); }
.page-body--case .psection-cols-3 .page-description h2:first-child,
.page-body--case .psection-cols-2 .page-description h2:first-child { font-size: clamp(26px, 2.6vw, 32px); }
/* Realizacje: jednolity wygląd przeniesionych tekstów (migracja 17 usuwa ręczne style) */
.page-body--case .page-description > h2:first-child { font-size: clamp(24px, 2.4vw, 30px); line-height: 1.25; color: var(--c-green-dark); }
.page-body--case .page-description h3 { font-family: var(--f-sans); font-weight: 600; font-size: clamp(19px, 1.6vw, 22px); line-height: 1.3; margin-top: 1.8em; }
.page-body--case .page-description blockquote, .page-body--service .page-description blockquote { margin: 1.8em 0; padding: 24px 28px; border-left: 0; border-radius: var(--r-md); background: var(--c-green-mist); font-family: inherit; font-size: inherit; line-height: inherit; }
.page-body--case .page-description blockquote, .page-body--service .page-description blockquote > * + * { margin-top: .8em; }
.page-body--case .page-description blockquote, .page-body--service .page-description blockquote > :first-child { margin-top: 0; }
.page-body--case .page-description p:has(> img:only-child) { margin: 1.8em 0; }
.page-body--case .page-description img { display: block; margin-inline: auto; max-width: 100%; }
.page-description img.is-zoomable { cursor: zoom-in; }
.page-body--article { padding-top: clamp(32px, 4vw, 48px); }
.page-body--article .page-body__in { max-width: 820px; }
.page-body--article .page-description { font-size: 18px; line-height: 1.7; }

/* Bloki */
.block { padding: var(--section-y) 0; }
.block--alt { background: var(--c-white); }
.block__head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 16px 40px; margin-bottom: 36px; }
.block__head .h2 { max-width: 16em; }
.block__lead { max-width: 520px; font-size: 17px; line-height: 1.55; color: var(--c-text-2); }
.block--kroki .container { display: grid; gap: 32px 64px; }
@media (min-width: 960px) { .block--kroki .container { grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); align-items: start; } }
.block__head--side { flex-direction: column; align-items: flex-start; margin-bottom: 0; }
.cards { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr)); gap: 20px; }
.card { background: var(--c-white); border-radius: var(--r-md); padding: 26px; display: flex; flex-direction: column; gap: 10px; font-size: 15px; line-height: 1.55; color: var(--c-text-2); }
.block--alt .card { background: var(--c-paper); }
.card__title { font-family: var(--f-serif); font-weight: 500; font-size: 24px; line-height: 1.2; color: var(--c-ink); }
.card__list { margin: 4px 0 0; padding-left: 1.2em; display: flex; flex-direction: column; gap: 6px; }
.card__list li::marker { color: var(--c-green-dark); }
.steps { list-style: none; margin: 0; padding: 0; counter-reset: step; display: flex; flex-direction: column; }
.step { counter-increment: step; display: grid; grid-template-columns: 56px 1fr; gap: 4px 20px; padding: 22px 0; border-top: 1px solid var(--c-line); }
.step:last-child { border-bottom: 1px solid var(--c-line); }
.step::before { content: counter(step, decimal-leading-zero); grid-row: span 2; font-family: var(--f-serif); font-size: 34px; line-height: 1; color: var(--c-green-dark); }
.step__title { font-weight: 600; font-size: 17px; }
.step__text { color: var(--c-text-2); font-size: 16px; line-height: 1.55; }
.checklist { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: 14px 40px; }
.checklist li { position: relative; padding-left: 34px; font-size: 17px; line-height: 1.5; }
.checklist li::before { content: ''; position: absolute; left: 0; top: .2em; width: 20px; height: 20px; border-radius: 50%; background: var(--c-green-mist) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5.5 10.5l3 3 6-7' fill='none' stroke='%23146755' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 20px no-repeat; }
.block__statement { max-width: 920px; margin: 0 auto; text-align: center; display: flex; flex-direction: column; gap: 18px; }
.block__statement p { font-family: var(--f-serif); font-size: clamp(22px, 2.6vw, 30px); line-height: 1.35; }
.block__statement p + p { font-family: var(--f-sans); font-size: 17px; line-height: 1.6; color: var(--c-text-2); }
.block__statement strong { font-weight: 500; color: var(--c-green-dark); }
.case-grid--2 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); }
.case-grid--3 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); }
.case-grid--2 .case-card img, .case-grid--3 .case-card img { height: auto; aspect-ratio: 8 / 5; }

/* Fakty: czas, cena, dalej */
.facts { padding: clamp(48px, 6vw, 72px) 0; background: var(--c-green-mist); }
.facts__grid { margin: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 24px 40px; }
.facts__item dt { font-size: 13px; letter-spacing: .14em; text-transform: uppercase; color: var(--c-green-dark); font-weight: 600; margin-bottom: 8px; }
.facts__item dd { margin: 0; font-size: 17px; line-height: 1.55; }
.facts__item:nth-child(2) dd { font-family: var(--f-serif); font-size: clamp(26px, 2.6vw, 32px); line-height: 1.2; }

/* Powiązane, inne usługi */
.related { padding: clamp(56px, 7vw, 88px) 0; }
.related--articles { background: var(--c-white); }
.related__label { font-family: var(--f-sans); font-size: 13px; letter-spacing: .14em; text-transform: uppercase; color: var(--c-green-dark); font-weight: 600; margin-bottom: 20px; }
.related--cases .h2 { margin-bottom: 32px; }
.article-links { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--c-line); }
.article-links a { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 6px 24px; padding: 20px 0; border-bottom: 1px solid var(--c-line); text-decoration: none; color: var(--c-ink); }
.article-links__title { font-family: var(--f-serif); font-size: clamp(20px, 2vw, 24px); line-height: 1.3; }
.article-links__date { font-size: 14px; color: var(--c-text-2); }
.article-links a:hover .article-links__title { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .15em; }
.siblings { padding: clamp(40px, 5vw, 56px) 0; border-top: 1px solid var(--c-line); }
.pill-list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.pill-list a { display: inline-flex; align-items: center; min-height: 44px; padding: 10px 18px; border-radius: 999px; background: var(--c-white); border: 1px solid var(--c-line); color: var(--c-ink); text-decoration: none; font-weight: 500; font-size: 15px; }
.pill-list a:hover { border-color: var(--c-green-dark); color: var(--c-green-deep); }
.subnav { background: var(--c-white); border-bottom: 1px solid var(--c-line-2); }
.subnav ul { list-style: none; margin: 0; padding: 14px 0; display: flex; flex-wrap: wrap; gap: 8px; }
.subnav a { display: inline-block; padding: 8px 16px; border-radius: 999px; text-decoration: none; color: var(--c-ink); font-size: 15px; background: var(--c-paper); }
.subnav a:hover { background: var(--c-green-mist); }
.subnav a[aria-current] { background: var(--c-green-dark); color: var(--c-white); }

/* Galeria i „gdzie o tym mówiono” */
.gallery-band { padding: var(--section-y) 0; background: var(--c-white); }
.gallery { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr)); gap: 12px; }
.gallery a { display: block; border-radius: 14px; overflow: hidden; background: var(--c-paper); cursor: zoom-in; }
.gallery img { width: 100%; aspect-ratio: 1; height: auto; object-fit: cover; transition: transform .4s var(--ease); }
.gallery a:hover img { transform: scale(1.03); }
.gallery__credit { margin-top: 16px; font-size: 14px; color: var(--c-text-2); }
.media-list { padding: clamp(48px, 6vw, 72px) 0; }
.media-list p { max-width: 60em; font-size: 18px; line-height: 1.7; }

/* Wezwanie i formularz na końcu */
.cta-band { padding: clamp(56px, 7vw, 88px) 0; }
.cta-band__in { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 24px 48px; }
.cta-band .h2 { max-width: 18em; }
.cta-band .lead { margin-top: 12px; }
.form-band { padding: var(--section-y) 0; }
.form-band:focus { outline: none; }
.form-band__in { display: flex; flex-wrap: wrap; gap: 56px; }
.form-band__text { flex: 1 1 360px; min-width: 0; display: flex; flex-direction: column; gap: 18px; }
.form-band__form { flex: 1 1 560px; min-width: 0; }

/* Artykuł PR Flash */
.article__head { padding: clamp(32px, 4vw, 48px) 0 0; }
.article__narrow { max-width: 868px; display: flex; flex-direction: column; gap: 18px; }
.article__title { font-family: var(--f-serif); font-weight: 400; font-size: clamp(34px, 4.4vw, 52px); line-height: 1.1; }
.article__figure { margin: clamp(28px, 4vw, 44px) auto 0; max-width: 1100px; }
.article__figure img { width: 100%; max-height: 620px; object-fit: cover; border-radius: var(--r-xl); }
.article__figure figcaption { margin-top: 10px; font-size: 14px; color: var(--c-text-2); }

/* „Dlaczego warto” i logotypy klientów */
.why { padding: var(--section-y) 0; }
.why .page-description { max-width: 52em; color: var(--c-on-dark); }
.why .page-description strong.zajawka1c, .why .page-description strong.zajawka1 { color: var(--c-on-dark); }
.why .page-description strong.zajawka2 { color: var(--c-green-pale); }
.why__btn { margin-top: 28px; }
.clients-band { padding: clamp(40px, 5vw, 64px) 0; background: var(--c-white); }
.logo-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 170px), 1fr)); gap: 16px; }
.logo-grid li { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; min-height: 120px; padding: 20px 16px; background: var(--c-white); border-radius: 16px; text-align: center; }
.clients-band .logo-grid li { background: var(--c-paper); }
.logo-grid img { max-height: 60px; max-width: 100%; width: auto; object-fit: contain; filter: grayscale(1); opacity: .8; mix-blend-mode: multiply; transition: filter .25s var(--ease), opacity .25s var(--ease); }
.logo-grid li:hover img { filter: none; opacity: 1; }
.logo-grid a { display: block; border-radius: 8px; }
.logo-grid__name { font-size: 12px; line-height: 1.3; color: var(--c-text-2); }
.logo-grid--compact li { min-height: 96px; }

/* Lightbox */
.has-lightbox, .has-lightbox body { overflow: hidden; }
.lightbox { position: fixed; inset: 0; z-index: 100; background: rgba(13, 26, 23, .94); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px; padding: 16px; }
.lightbox[hidden] { display: none; }
.lightbox__figure { margin: 0; display: flex; flex-direction: column; align-items: center; gap: 10px; max-width: 100%; min-height: 0; flex: 0 1 auto; }
.lightbox__img { max-width: min(1400px, 100%); max-height: calc(100vh - 160px); max-height: calc(100dvh - 160px); width: auto; height: auto; object-fit: contain; border-radius: 10px; }
.lightbox__caption { color: var(--c-on-dark-2); font-size: 14px; text-align: center; }
.lightbox__nav { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.lightbox__btn { min-height: 44px; padding: 10px 18px; border-radius: 999px; border: 1.5px solid #5E6B75; background: transparent; color: var(--c-on-dark); font-weight: 500; cursor: pointer; }
.lightbox__btn:hover { border-color: var(--c-on-dark); }
.lightbox__btn[hidden] { display: none; }
.lightbox__close { background: var(--c-paper); color: var(--c-ink); border-color: var(--c-paper); }
.lightbox__close:hover { background: var(--c-white); }

@media (prefers-reduced-motion: reduce) {
	.gallery img, .logo-grid img { transition: none !important; transform: none !important; }
}

/* Blog PR Flash (moduł podstron: „Blog / aktualności”) */
.blog-list__items { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); gap: 40px 28px; }
.post__link { display: flex; flex-direction: column; gap: 16px; height: 100%; text-decoration: none; color: var(--c-ink); }
.post__link:hover { color: var(--c-ink); }
.post__media { display: block; border-radius: var(--r-md); overflow: hidden; background: var(--c-green-dark); aspect-ratio: 16 / 10; }
.post__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--ease); }
.post__link:hover .post__media img { transform: scale(1.03); }
.post__body { display: flex; flex-direction: column; gap: 8px; }
.post__date { font-size: 13px; letter-spacing: .08em; text-transform: uppercase; color: var(--c-green-dark); font-weight: 500; }
.post__title { font-family: var(--f-serif); font-weight: 500; font-size: 24px; line-height: 1.22; }
.post__link:hover .post__title { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .15em; }
.post__lead { font-size: 15px; line-height: 1.55; color: var(--c-text-2); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.post__more { margin-top: auto; padding-top: 4px; font-weight: 600; font-size: 15px; color: var(--c-green-dark); }
.post--featured { grid-column: 1 / -1; }
@media (min-width: 900px) {
	.post--featured .post__link { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 40px; align-items: center; }
	.post--featured .post__title { font-size: clamp(30px, 3vw, 40px); }
	.post--featured .post__lead { font-size: 17px; -webkit-line-clamp: 5; }
}
@media (prefers-reduced-motion: reduce) { .post__media img { transition: none; } }

/* Rozwijane dane (np. Kontakt: dane firmy i adresy biur) */
.page-description details { margin-top: 2em; border-top: 1px solid var(--c-line); border-bottom: 1px solid var(--c-line); }
.page-description summary {
	display: flex; justify-content: space-between; align-items: center; gap: 16px; min-height: 56px; padding: 14px 4px;
	cursor: pointer; list-style: none; font-weight: 600; font-size: 17px;
}
.page-description summary::-webkit-details-marker { display: none; }
.page-description summary::after {
	content: ''; flex: 0 0 auto; width: 12px; height: 12px; margin-right: 6px;
	border-right: 2px solid var(--c-green-dark); border-bottom: 2px solid var(--c-green-dark);
	transform: translateY(-3px) rotate(45deg); transition: transform .25s var(--ease);
}
.page-description details[open] summary::after { transform: translateY(3px) rotate(-135deg); }
.page-description summary:hover { color: var(--c-green-dark); }
.page-description details > :not(summary) { padding: 0 4px; }
.page-description details > :last-child { padding-bottom: 20px; }
@media (prefers-reduced-motion: reduce) { .page-description summary::after { transition: none; } }

/* Usługa: pełny opis z edytora pod sekcjami – oddzielony linią, węższa kolumna tekstu */
.block + .page-body--service { border-top: 1px solid var(--c-line); }
.page-body--service .page-body__in > .psection-cols-1 .page-description { max-width: 820px; }

/* Blog PR Flash – karta: zdjęcie na całą szerokość, tekst z wewnętrznymi odstępami (poprawka po odbiorze) */
.blog-list .post__link {
	background: var(--c-white); border-radius: var(--r-md); overflow: hidden; gap: 0;
	box-shadow: 0 1px 0 var(--c-line-2);
}
.blog-list .post__media { border-radius: 0; }
.blog-list .post__body { flex: 1 1 auto; gap: 10px; padding: 20px 22px 24px; }
.blog-list .post__title { margin-top: 2px; }
.blog-list .post__more { padding-top: 10px; }
@media (min-width: 640px) {
	.blog-list .post__body { padding: 22px 24px 26px; }
}
@media (min-width: 900px) {
	.blog-list .post--featured .post__link { gap: 0; align-items: stretch; }
	.blog-list .post--featured .post__media { aspect-ratio: auto; min-height: 340px; }
	.blog-list .post--featured .post__media img { height: 100%; }
	.blog-list .post--featured .post__body { justify-content: center; gap: 14px; padding: 40px 44px; }
}

/* Odbiór: numer etapu na aktywnym (zielonym) przycisku bez przezroczystości – kontrast WCAG AA */
.stagebar a[aria-current] .stagebar__nr { opacity: 1; }

/* Odbiór: długie adresy i słowa w treściach z edytora łamią się zamiast rozpychać stronę na telefonie */
.page-description { overflow-wrap: anywhere; }
.page-description table { overflow-wrap: normal; }

/* Cookies: przycisk „Tylko niezbędne” i „Ustawienia cookies” w stopce */
.btn--outline { background: transparent; color: var(--c-ink); border-color: var(--c-input); }
.btn--outline:hover { border-color: var(--c-ink); color: var(--c-ink); }
.site-footer__cookies { padding: 0; border: 0; background: none; font: inherit; color: var(--c-green); text-decoration: underline; text-underline-offset: .18em; cursor: pointer; }
.site-footer__cookies:hover { color: var(--c-green-pale); }

/* Poprawka: sekcja „Realizacje” na stronie głównej – odstęp góra/dół jak pozostałe sekcje */
.home-cases { padding: var(--section-y) 0; }

/* ==================================================================
   Usługi AI – różowo-fioletowe wyróżnienie (próba 21.10.2026)
   ================================================================== */
.ai-badge, .studio-card--ai .studio-card__name::after, .page-module__subpages li.is-ai a > strong b:first-child::after {
	content: "AI"; display: inline-block; vertical-align: middle; margin-left: 10px; padding: 3px 9px 2px; border-radius: 999px;
	background: var(--g-ai); color: #fff; font-family: var(--f-sans); font-size: 11px; font-weight: 600; letter-spacing: .08em; line-height: 1.4;
}
.studio-card--ai, .page-module__subpages li.is-ai a {
	border: 2px solid transparent;
	background: linear-gradient(var(--c-white), var(--c-white)) padding-box, var(--g-ai) border-box;
}
.page-module__subpages li.is-ai a > i { background: var(--g-ai); }
.page-module__subpages li.is-ai a > i > img { mix-blend-mode: luminosity; opacity: .55; }

/* blok GPR PRism na stronie głównej */
.home-ai { background: var(--g-ai); position: relative; overflow: hidden; isolation: isolate; }
.home-ai::before, .home-ai::after { content: ""; position: absolute; z-index: -1; border-radius: 50%; pointer-events: none; }
.home-ai::before { width: 560px; height: 560px; right: -160px; top: -240px; background: radial-gradient(circle, rgba(255, 255, 255, .20), transparent 68%); }
.home-ai::after { width: 420px; height: 420px; left: -140px; bottom: -220px; background: radial-gradient(circle, rgba(42, 18, 64, .35), transparent 70%); }
.home-ai .eyebrow, .home-ai .lead, .home-ai__note { color: #fff; }
.home-ai__cta .btn { color: var(--c-ai-violet); }

/* zdjęcie miasta nad briefem */
.home-city { position: relative; margin: 0; }
.home-city img { display: block; width: 100%; height: min(max(240px, 30vw), 620px); object-fit: cover; object-position: 70% 33%; } /* cały Spodek z oświetleniem; na szerokich ekranach wyższy pas, żeby nie spłaszczał kadru */
.home-city figcaption { position: absolute; left: 0; right: 0; bottom: clamp(16px, 2.4vw, 28px); }
.home-city figcaption span { display: inline-block; padding: 9px 16px; border-radius: 999px; background: rgba(13, 26, 23, .78); color: #fff; font-size: 14px; line-height: 1.4; }

/* ==================================================================
   Slider na górze strony głównej (zamiast otwarcia) – wariant B, w szerokości treści
   ================================================================== */
.hero-slider { background: var(--g-brand); padding: clamp(16px, 2vw, 28px) 0 clamp(32px, 4vw, 48px); }
.hs { position: relative; display: grid; border-radius: var(--r-xl); overflow: hidden; background: var(--c-green-deep); color: #fff; }
.hs__slide { grid-area: 1 / 1; position: relative; min-height: 440px; aspect-ratio: 16 / 7; opacity: 0; visibility: hidden; transition: opacity .7s var(--ease), visibility 0s linear .7s; }
.hs__slide.is-active { opacity: 1; visibility: visible; transition: opacity .7s var(--ease); }
.hs__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hs__shade { position: absolute; inset: 0; background: /* lżejsze przyciemnienie w zieleni z logo (#0E4A3F) – tylko pod napisem, w lewym dolnym rogu */
	linear-gradient(0deg, rgba(14, 74, 63, .74) 0%, rgba(14, 74, 63, .32) 38%, rgba(14, 74, 63, 0) 62%),
	linear-gradient(90deg, rgba(14, 74, 63, .5) 0%, rgba(14, 74, 63, 0) 52%); }
.hs__slide--light .hs__shade { background: linear-gradient(0deg, rgba(14, 74, 63, .88) 0%, rgba(14, 74, 63, .6) 50%, rgba(14, 74, 63, .12) 85%); }
.hs__slide--noimg .hs__shade { display: none; }
.hs__slide--ai { background: var(--g-ai); }
.hs__slide--ai .hs__shade { background: linear-gradient(0deg, rgba(42, 18, 64, .55) 0%, rgba(42, 18, 64, 0) 70%); }
.hs__slide--ai .hs__img { mix-blend-mode: luminosity; opacity: .35; }
.hs__body { position: absolute; left: clamp(24px, 4vw, 56px); right: clamp(24px, 4vw, 56px); bottom: clamp(28px, 4vw, 52px); max-width: 640px; display: flex; flex-direction: column; gap: 16px; }
/* miękka zielona poświata pod napisami – czytelność na ruchliwych zdjęciach bez mocnego przyciemniania */
.hs__eyebrow, .hs__title, .hs__lead { text-shadow: 0 1px 2px rgba(14, 74, 63, .55), 0 2px 18px rgba(14, 74, 63, .65); }
.hs__slide--ai .hs__eyebrow, .hs__slide--ai .hs__title, .hs__slide--ai .hs__lead { text-shadow: none; }
@media (max-width: 760px) { .hs__eyebrow, .hs__title, .hs__lead { text-shadow: none; } }
.hs__eyebrow { margin: 0; font-size: 13px; letter-spacing: .14em; text-transform: uppercase; font-weight: 500; color: var(--c-green-pale); }
.hs__slide--ai .hs__eyebrow { color: #fff; }
.hs__eyebrow b { display: inline-block; margin-right: 8px; padding: 3px 9px 2px; border-radius: 999px; background: var(--g-ai); color: #fff; font-size: 11px; letter-spacing: .08em; box-shadow: 0 0 0 1px rgba(255, 255, 255, .35); }
.hs__title { margin: 0; font-family: var(--f-serif); font-weight: 400; font-size: clamp(34px, 4.4vw, 58px); line-height: 1.04; letter-spacing: -0.01em; }
h2.hs__title { font-size: clamp(30px, 3.8vw, 50px); }
.hs__title em { color: #9FE0C2; }
.hs__slide--ai .hs__title em { color: #fff; }
.hs__lead { margin: 0; font-size: 17px; line-height: 1.5; color: #E4EAE7; max-width: 520px; }
.hs__body .btn { align-self: flex-start; }
.hs__slide--ai .hs__body .btn { color: var(--c-ai-violet); }
.hs__ctrl { position: absolute; z-index: 2; right: clamp(20px, 3vw, 40px); bottom: clamp(28px, 4vw, 52px); display: flex; align-items: center; gap: 14px; }
.hs__count { font-size: 13px; letter-spacing: .08em; color: #E4EAE7; font-variant-numeric: tabular-nums; }
.hs__dots { display: flex; gap: 4px; }
.hs__dot { width: 24px; height: 24px; padding: 0; border: 0; background: none; cursor: pointer; display: grid; place-items: center; }
.hs__dot::before { content: ""; width: 8px; height: 8px; border-radius: 999px; background: rgba(255, 255, 255, .5); transition: width .3s var(--ease), background .3s; }
.hs__dot.is-on::before { width: 24px; background: #fff; }
.hs__dot:focus-visible, .hs__arrow:focus-visible { outline: 2px solid #fff; outline-offset: 2px; border-radius: 999px; }
.hs__arrow { width: 44px; height: 44px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, .55); display: grid; place-items: center; font-size: 18px; color: #fff; background: rgba(13, 26, 23, .25); cursor: pointer; transition: background .2s; }
.hs__arrow:hover { background: rgba(13, 26, 23, .55); }
@media (prefers-reduced-motion: reduce) { .hs__slide, .hs__slide.is-active { transition: none; } }
@media (max-width: 760px) {
	/* telefon: zdjęcie u góry, napis pod nim w tej samej karcie */
	.hs { grid-template-rows: auto auto; }
	.hs__slide { grid-row: 1; min-height: 0; aspect-ratio: auto; display: flex; flex-direction: column; }
	.hs__img { position: static; width: 100%; height: auto; aspect-ratio: 4 / 3; object-position: 70% center; }
	.hs__shade { display: none; }
	.hs__slide--ai .hs__img { display: none; }
	.hs__body { position: static; max-width: none; padding: 24px 22px 20px; gap: 12px; }
	.hs__title { font-size: 34px; }
	h2.hs__title { font-size: 30px; }
	.hs__lead { font-size: 16px; }
	.hs__ctrl { position: static; grid-row: 2; padding: 0 22px 22px; }
	.hs__slide--ai ~ .hs__ctrl { background: transparent; }
	.hs__arrow { display: none; }
}

/* ==================================================================
   Pas usług pod sliderem (ciemnozielony) – podstrony wybierane w panelu
   ================================================================== */
.svc-strip { background: var(--c-green-deep); color: var(--c-on-dark); }
.svc-strip__in { display: flex; align-items: center; gap: 14px 28px; min-height: 64px; padding-top: 14px; padding-bottom: 14px; }
.svc-strip__label { margin: 0; flex: 0 0 auto; display: flex; align-items: center; gap: 28px; font-family: var(--f-serif); font-size: 22px; line-height: 1.2; color: #fff; white-space: nowrap; }
.svc-strip__label::after { content: ""; width: 1px; height: 30px; background: rgba(255, 255, 255, .25); }
.svc-strip__list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 0; font-size: 15px; }
.svc-strip__list li { display: flex; align-items: center; }
.svc-strip__list li + li::before { content: "·"; margin: 0 12px; color: var(--c-green); }
.svc-strip__list a { color: var(--c-on-dark); text-decoration: none; }
.svc-strip__list a:hover { color: #fff; text-decoration: underline; text-underline-offset: .2em; }
.svc-strip__ai { display: inline-block; margin-left: 7px; padding: 2px 7px 1px; border-radius: 999px; background: var(--g-ai); color: #fff; font-size: 10px; font-weight: 600; letter-spacing: .08em; }
@media (max-width: 760px) {
	.svc-strip__in { flex-direction: column; align-items: flex-start; gap: 10px; }
	.svc-strip__label { font-size: 20px; }
	.svc-strip__label::after { display: none; }
	.svc-strip__list { gap: 8px 18px; font-size: 14px; }
	.svc-strip__list li::before, .svc-strip__list li + li::before { content: ""; width: 5px; height: 5px; margin: 0 8px 0 0; border-radius: 50%; background: var(--c-green); }
}

/* Treści ze starego edytora (migracja 22): lead pod śródtytułem i układ „zdjęcie | tekst” zamiast tabel */
.page-description p.lead { font-size: clamp(18px, 1.6vw, 21px); line-height: 1.5; color: var(--c-text-2); }
.page-description .media-row { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: clamp(20px, 3vw, 40px); align-items: start; margin: 2em 0; } /* zdjęcie przy górze tekstu – przy długich opisach nie „pływa” w środku */
.page-description .media-row__img { margin: 0; }
.page-description .media-row__img img { display: block; width: 100%; height: auto; border-radius: var(--r-md); }
.page-description .media-row__text > :first-child { margin-top: 0; }
.page-description .media-row__text > * + * { margin-top: 1em; }
.page-description .media-row--img-right { grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); }
.page-description .media-row--cols { grid-template-columns: 1fr 1fr; align-items: start; }
.page-description .media-row--cols ul { margin: 0; }
@media (max-width: 760px) { .page-description .media-row, .page-description .media-row--img-right, .page-description .media-row--cols { grid-template-columns: 1fr; } }

/* FAQ – pytania dużym krojem, odpowiedź rozwijana (natywne <details>, migracja 24) */
.page-description .faq-item { border-bottom: 1px solid var(--c-line); margin: 0; }
.page-description .faq-item:first-of-type { border-top: 1px solid var(--c-line); }
.page-description .faq-item > summary {
	list-style: none; cursor: pointer; display: flex; align-items: flex-start; justify-content: space-between; gap: 24px;
	padding: 22px 0; font-family: var(--f-serif); font-weight: 400; font-size: clamp(22px, 2.2vw, 28px); line-height: 1.25; color: var(--c-ink);
}
.page-description .faq-item > summary::-webkit-details-marker { display: none; }
.page-description .faq-item > summary::after { /* „+” / „−” rysowane kreskami – niezależnie od fontu */
	content: ""; flex: 0 0 auto; width: 36px; height: 36px; margin-top: -2px; border-radius: 50%; border: 1px solid var(--c-line);
	background: linear-gradient(var(--c-green-dark), var(--c-green-dark)) center / 14px 2px no-repeat,
		linear-gradient(var(--c-green-dark), var(--c-green-dark)) center / 2px 14px no-repeat;
	transition: background-color .2s; transform: none; margin-right: 0; /* bez obrotu ze wspólnego stylu <details> (Kontakt) */
}
.page-description .faq-item[open] > summary::after {
	transform: none;
	background: linear-gradient(var(--c-green-dark), var(--c-green-dark)) center / 14px 2px no-repeat, var(--c-green-mist);
}
.page-description .faq-item > summary:hover { color: var(--c-green-dark); }
.page-description .faq-item > summary:focus-visible { outline: 2px solid var(--c-green-dark); outline-offset: 4px; border-radius: 4px; }
.page-description .faq-item__a { padding: 0 60px 24px 0; }
.page-description h2 + .faq-item { margin-top: .8em; }
.page-description .faq-item + :not(.faq-item) { margin-top: 2.2em; } /* odstęp po liście pytań (np. podstrona Hybrid PR) */
.page-description .faq-item__a > * + * { margin-top: 1em; }
.page-description .faq-item + * { margin-top: 0; }
@media (max-width: 760px) { .page-description .faq-item__a { padding-right: 0; } }

/* ==================================================================
   Kafle usług bez zdjęć (wariant B, decyzja 23.10.2026): „okładka” w gradiencie z logo
   – tytuł (Newsreader 700) i zajawka na okładce, tekst wprowadzenia pod spodem; usługi AI – gradient różowo-fioletowy
   ================================================================== */
.page-module__subpages a.tile { display: flex; flex-direction: column; }
.tile__cover {
	position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: flex-end;
	min-height: 184px; padding: 22px 24px; background: var(--g-brand-text); color: #fff;
}
.tile__cover::after { content: ""; position: absolute; width: 220px; height: 220px; right: -60px; top: -80px; border-radius: 50%; background: radial-gradient(circle, rgba(255, 255, 255, .16), transparent 70%); pointer-events: none; }
.page-module__subpages a.tile .tile__name { position: relative; font-family: var(--f-serif); font-weight: 700; font-size: clamp(22px, 2vw, 27px); line-height: 1.14; color: #fff; }
.tile__sub { position: relative; margin-top: 8px; font-size: 14px; line-height: 1.4; color: #DDF1E8; }
.tile__ai { position: relative; align-self: flex-start; margin-bottom: 10px; padding: 3px 9px 2px; border-radius: 999px; background: rgba(255, 255, 255, .22); color: #fff; font-size: 11px; font-weight: 600; letter-spacing: .08em; }
.tile__body { display: flex; flex-direction: column; flex: 1; padding: 18px 24px 22px; }
.tile__desc { font-size: 15px; line-height: 1.55; color: var(--c-text-2); }
.tile__more { margin-top: auto; padding-top: 16px; font-size: 14px; font-weight: 600; color: var(--c-green-dark); }
.page-module__subpages a.tile:hover .tile__more { text-decoration: underline; text-underline-offset: .2em; }
.page-module__subpages li.is-ai .tile__cover { background: var(--g-ai); }
.page-module__subpages li.is-ai .tile__sub { color: #F6E7F2; }
.page-module__subpages li.is-ai .tile__more { color: var(--c-ai-violet); }

/* Kontakt: przyciski „Pokaż numer telefonu / adres e-mail” (bez JS – ukryte, zostaje formularz) */
.reveal-row { margin-top: 28px; display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; }
.no-js .reveal-row { display: none; }
.reveal { gap: 10px; cursor: pointer; }
.reveal__icon { display: inline-grid; place-items: center; }
.reveal__value { display: inline-flex; align-items: center; min-height: 48px; padding: 10px 20px; border-radius: 999px; background: rgba(255, 255, 255, .12); color: #fff; font-size: 18px; font-weight: 600; letter-spacing: .01em; user-select: all; }
.reveal__value:focus { outline: 2px solid #fff; outline-offset: 2px; }

/* Strona główna, sekcja briefu: przycisk do strony Kontakt pod tekstem */
.home-brief__btn { align-self: flex-start; margin-top: 8px; }

/* ==================================================================
   Ułatwienia dostępu (przycisk z okularami w nagłówku, decyzja 23.10.2026)
   ================================================================== */
.a11y { position: relative; flex: 0 0 auto; }
.no-js .a11y { display: none; }
.a11y__toggle { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; padding: 0; border: 1.5px solid rgba(255, 255, 255, .45); background: transparent; color: #fff; cursor: pointer; transition: background .2s, color .2s; }
.a11y__toggle:hover { background: rgba(255, 255, 255, .12); }
.a11y__toggle[aria-expanded="true"] { background: #fff; color: var(--c-green-deep); border-color: #fff; }
.a11y__toggle:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.a11y__panel { position: absolute; right: 0; top: calc(100% + 10px); z-index: 60; width: min(310px, calc(100vw - 32px)); padding: 18px 18px 14px; border-radius: var(--r-md); background: #fff; color: var(--c-ink); box-shadow: 0 18px 40px rgba(13, 26, 23, .25); }
.a11y__panel[hidden] { display: none; }
.a11y__title { margin: 0 0 8px; font-family: var(--f-serif); font-size: 21px; }
.a11y__row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 0; border-top: 1px solid var(--c-line-2); }
.a11y__label { margin: 0; font-size: 14px; color: var(--c-text-2); }
.a11y__group { display: flex; gap: 6px; }
.a11y__opt { min-height: 40px; padding: 6px 12px; border-radius: 999px; border: 1.5px solid var(--c-line); background: #fff; color: var(--c-ink); font-size: 14px; font-weight: 600; cursor: pointer; }
.a11y__opt--fs { min-width: 44px; }
.a11y__opt--fs[data-a11y-fs="1"] { font-size: 15px; }
.a11y__opt--fs[data-a11y-fs="2"] { font-size: 17px; }
.a11y__opt:hover { border-color: var(--c-green-dark); }
.a11y__opt[aria-pressed="true"] { background: var(--c-green-dark); border-color: var(--c-green-dark); color: #fff; }
.a11y__opt:focus-visible, .a11y__reset:focus-visible { outline: 2px solid var(--c-green-dark); outline-offset: 2px; }
.a11y__reset { margin-top: 6px; padding: 6px 0; border: 0; background: none; color: var(--c-green-dark); font-size: 14px; font-weight: 600; text-decoration: underline; text-underline-offset: .2em; cursor: pointer; }

/* rozmiar tekstu: skala całego układu (jak powiększenie w przeglądarce – nic się nie rozjeżdża) */
html.a11y-fs1 body { zoom: 1.15; }
html.a11y-fs2 body { zoom: 1.3; }

/* prosta czcionka: wszystko bezszeryfowym, bardzo czytelnym krojem */
html.a11y-sans body, html.a11y-sans body * { font-family: Verdana, Tahoma, 'DejaVu Sans', Arial, sans-serif !important; letter-spacing: .01em; }

/* wysoki kontrast: czarny tekst na bieli, czerń zamiast gradientów, podkreślone linki, żółte przyciski */
html.a11y-hc {
	--c-ink: #000; --c-text-2: #000; --c-paper: #fff; --c-white: #fff; --c-line: #000; --c-line-2: #000; --c-input: #000;
	--c-green-dark: #00573F; --c-green-mist: #fff; --c-green-pale: #fff; --c-green-deep: #000; --c-green: #FFE14D;
	--c-on-dark: #fff; --c-on-dark-2: #fff; --c-on-dark-3: #fff;
	--g-brand: linear-gradient(#000, #000); --g-brand-text: linear-gradient(#000, #000); --g-ai: linear-gradient(#000, #000); --c-ai-violet: #000;
}
html.a11y-hc body { background: #fff; color: #000; }
html.a11y-hc a:not(.btn):not(.tile) { text-decoration: underline; text-underline-offset: .18em; }
html.a11y-hc .btn--accent { background: #FFE14D; color: #000; border: 2px solid #000; }
html.a11y-hc .btn--light { background: #fff; color: #000; border: 2px solid #000; }
html.a11y-hc .btn--outline-light { border-color: #fff; color: #fff; }
html.a11y-hc .hs__shade { background: linear-gradient(0deg, rgba(0, 0, 0, .9) 0%, rgba(0, 0, 0, .6) 55%, rgba(0, 0, 0, .25) 100%); }
html.a11y-hc .hs__eyebrow, html.a11y-hc .hs__title, html.a11y-hc .hs__lead { text-shadow: none; color: #fff; }
html.a11y-hc .hs__title em, html.a11y-hc .home-hero__title em { color: #FFE14D; }
html.a11y-hc .section--dark .eyebrow, html.a11y-hc .section--dark .lead, html.a11y-hc .tile__sub, html.a11y-hc .svc-strip__list a { color: #fff; }
html.a11y-hc .studio-card, html.a11y-hc .process-card, html.a11y-hc .page-module__subpages a, html.a11y-hc .home-industries, html.a11y-hc .home-brief__form > *, html.a11y-hc .path-card { box-shadow: none; outline: 2px solid #000; outline-offset: -2px; }
html.a11y-hc .tile__more, html.a11y-hc .home-industries__list a span { color: #000; }
html.a11y-hc .home-industries__list a, html.a11y-hc .home-industries__list span { border-bottom-color: #000; }
html.a11y-hc .cookies { border: 2px solid #000; }
html.a11y-hc :focus-visible { outline: 3px solid #000 !important; box-shadow: 0 0 0 6px #FFE14D; }
html.a11y-hc .a11y__toggle { border-color: #fff; }
html.a11y-hc .a11y__opt[aria-pressed="true"] { background: #000; border-color: #000; }

/* Podstrony usług AI: zielona sekcja tytułowa zostaje – akcenty AI: znaczek przed tytułem, pasek u dołu, delikatna poświata */
.is-ai-service #main > .section--dark:first-child { position: relative; isolation: isolate; overflow: hidden; }
.is-ai-service #main > .section--dark:first-child::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 5px; background: var(--g-ai); }
.is-ai-service #main > .section--dark:first-child::before { content: ""; position: absolute; z-index: -1; width: 520px; height: 520px; right: -140px; top: -180px; border-radius: 50%; background: radial-gradient(circle, rgba(194, 64, 127, .28), rgba(123, 69, 214, .12) 45%, transparent 70%); pointer-events: none; }
.is-ai-service .page-hero h1::before {
	content: "AI"; display: inline-block; vertical-align: .45em; margin-right: 14px; padding: 4px 11px 3px; border-radius: 999px;
	background: var(--g-ai); font-family: var(--f-sans); font-size: 14px; font-weight: 600; letter-spacing: .08em; line-height: 1.4; color: #fff;
}
html.a11y-hc .is-ai-service #main > .section--dark:first-child::before { display: none; }

/* ===== Strona zbiorcza usług (układ „ai_hub”, np. /ai-visibility) ===== */
.page-hero--hub { padding: 64px 0 80px; }
.page-hero--hub .page-hero__title { max-width: 15ch; margin-bottom: 24px; }
.page-hero--hub .lead { max-width: 60ch; }
.hub-stat { display: flex; gap: 18px; align-items: baseline; max-width: 720px; margin: 36px 0 0; padding-top: 24px; border-top: 1px solid rgba(255, 255, 255, .2); }
.hub-stat b { font-family: var(--f-serif); font-size: 46px; font-weight: 400; line-height: 1; color: #fff; white-space: nowrap; }
.hub-stat span { font-size: 15px; line-height: 1.5; color: var(--c-on-dark-2); }
.hub-services { padding: var(--section-y) 0; }
.hub-cards { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 64px 1fr; align-items: stretch; }
.hub-cards__arrow { display: flex; align-items: center; justify-content: center; color: var(--c-green-dark); font-size: 28px; }
.hub-card { position: relative; overflow: hidden; display: flex; flex-direction: column; background: var(--c-white); border: 1px solid var(--c-line); border-radius: var(--r-lg); padding: 34px 34px 30px; }
.hub-card::before { content: ""; position: absolute; inset: 0 0 auto; height: 4px; background: var(--g-ai); }
.hub-card__step { margin: 0; font-size: 13px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: #8A3CA0; }
.hub-card__name { margin: 10px 0 4px; font-family: var(--f-serif); font-weight: 700; font-size: 30px; line-height: 1.12; }
.hub-card__name a { color: inherit; text-decoration: none; }
.hub-card__name a:hover { color: var(--c-green-dark); }
.hub-card__sub { margin: 0 0 22px; font-size: 16px; color: var(--c-text-2); }
.hub-card__quote { margin: 0 0 22px; padding-left: 16px; border-left: 3px solid var(--c-green); font-family: var(--f-serif); font-size: 21px; line-height: 1.35; }
.hub-card__list { list-style: none; margin: 0 0 24px; padding: 0; display: grid; gap: 10px; font-size: 16px; line-height: 1.45; }
.hub-card__list li { position: relative; padding-left: 26px; }
.hub-card__list li::before { content: ""; position: absolute; left: 2px; top: .45em; width: 12px; height: 7px; border-left: 2px solid var(--c-green-dark); border-bottom: 2px solid var(--c-green-dark); transform: rotate(-45deg); }
.hub-card__meta { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin: auto 0 26px; padding-top: 20px; border-top: 1px solid var(--c-line); font-size: 14px; }
.hub-card__meta dt { margin-bottom: 3px; font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--c-text-2); }
.hub-card__meta dd { margin: 0; font-weight: 600; }
.hub-card .btn { align-self: flex-start; }
.page-body--hub { background: var(--c-white); border-top: 1px solid var(--c-line); border-bottom: 1px solid var(--c-line); }
.page-body--hub table { display: table; width: 100%; border-collapse: collapse; font-size: 16px; line-height: 1.45; }
.page-body--hub th, .page-body--hub td { padding: 16px 18px; border: 0; border-bottom: 1px solid var(--c-line); text-align: left; vertical-align: top; }
.page-body--hub .page-description { max-width: none; }
.page-body--hub thead th { font-family: var(--f-serif); font-size: 20px; font-weight: 700; border-bottom: 2px solid var(--c-ink); }
.page-body--hub tbody th { width: 16%; font-size: 13px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--c-text-2); }
.page-body--hub td:last-child, .page-body--hub th:last-child { background: rgba(156, 67, 174, .05); }
@media (max-width: 900px) {
	.hub-cards { grid-template-columns: 1fr; }
	.hub-cards__arrow { height: 46px; transform: rotate(90deg); }
	.hub-card { padding: 28px 22px 24px; }
	.page-body--hub table { display: block; overflow-x: auto; }
}
html.a11y-hc .hub-card { border: 2px solid #000; }
html.a11y-hc .hub-card__step { color: #000; }
