@charset "UTF-8";
/* =====================================================================
   FAQ - wariant "refined"
   Blok: acf/content-title-block z zaznaczonym stylem "style-faq"
   Tlo sekcji: panel "Style" bloku -> "Tlo bezowe" (domyslne) / "Tlo biale"
   ===================================================================== */

.content-title-block.style-faq {
	--faq-bg: #f3f0e9;
	--faq-edge: #e8e3d9;
	--faq-line: #d9d3c8;
	--faq-accent: var(--invest-accent-dark, #987536);
	--faq-ink: #242723;
	--faq-muted: #62645e;
	--faq-body: #55584f;
	--faq-ease: cubic-bezier(.4, 0, .2, 1);
	--faq-panel-pr: 36px;

	background-color: var(--faq-bg);
	border-top: 1px solid var(--faq-edge);
	border-bottom: 1px solid var(--faq-edge);
	padding-top: 72px;
	padding-bottom: 72px;
}

/* --- Warianty tla ---------------------------------------------------
   front: klasa trafia na sekcje (filtr render_block w functions.php)
   edytor: klasa jest na wrapperze bloku */
.content-title-block.style-faq.is-style-faq-white,
.is-style-faq-white .content-title-block.style-faq {
	--faq-bg: #ffffff;
	--faq-edge: #efebe3;
	--faq-line: #e3ddd2;
}
.content-title-block.style-faq.is-style-faq-beige,
.is-style-faq-beige .content-title-block.style-faq {
	--faq-bg: #f3f0e9;
}

/* --- Uklad: 1fr / 2fr ------------------------------------------------ */
.content-title-block.style-faq .content-title-block__container {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
	grid-template-rows: auto 1fr;
	column-gap: 80px;
	align-items: start;
}
.content-title-block.style-faq .content-title-block__wr { display: contents; }
.content-title-block.style-faq .content-title-block__title        { grid-column: 1; grid-row: 1; margin: 0; padding: 0; }
.content-title-block.style-faq .content-title-block__content      { grid-column: 1; grid-row: 2; margin: 0; padding: 0; }
.content-title-block.style-faq .content-title-block__content-main { grid-column: 2; grid-row: 1 / span 2; margin: 0; min-width: 0; }

/* --- Lewa kolumna ---------------------------------------------------- */
.content-title-block.style-faq .content-title-block__title::before {
	content: "Warto wiedzie\0107";
	display: block;
	margin-bottom: 18px;
	font-family: "Playfair Display", serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.4;
	letter-spacing: .025em;
	text-transform: uppercase;
	color: var(--faq-accent);
}
.content-title-block.style-faq .content-title-block__title h2 {
	margin: 0 0 18px;
	padding: 0;
	border: 0;
	font-family: "Playfair Display", serif;
	font-size: clamp(34px, 3vw, 43px);
	font-weight: 400;
	line-height: 1.24;
	letter-spacing: -.022em;
	text-transform: none;
	color: var(--faq-ink);
}
.content-title-block.style-faq .content-title-block__content,
.content-title-block.style-faq .content-title-block__content p {
	max-width: 240px;
	margin: 0;
	font-family: "DM Sans", sans-serif;
	font-size: 14px;
	line-height: 1.7;
	color: var(--faq-muted);
}

/* --- Lista pytan (core/accordion) ------------------------------------ */
.content-title-block.style-faq .wp-block-accordion { margin: 0; padding: 0; gap: 0; }
.content-title-block.style-faq .wp-block-accordion > * + * { margin-top: 0; }

/* selektory z .wp-block-accordion, zeby wygrac z regulami motywu w main.css */
.content-title-block.style-faq .wp-block-accordion .wp-block-accordion-item,
.content-title-block.style-faq .wp-block-accordion .wp-block-accordion-item.is-open {
	margin: 0;
	padding: 0;
	border: 0;
	border-top: 1px solid var(--faq-line);
	border-radius: 0;
	background: none;
	box-shadow: none;
}
.content-title-block.style-faq .wp-block-accordion .wp-block-accordion-item:last-child { border-bottom: 1px solid var(--faq-line); }
.content-title-block.style-faq .wp-block-accordion .wp-block-accordion-heading { margin: 0; padding: 0; font-size: inherit; }

.content-title-block.style-faq .wp-block-accordion-heading__toggle {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 30px;
	width: 100%;
	margin: 0;
	padding: 22px 0;
	border: 0;
	border-radius: 0;
	background: none;
	cursor: pointer;
	text-align: left;
	font-family: "DM Sans", sans-serif;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.5;
	color: var(--faq-ink);
	transition: color .25s var(--faq-ease);
}
.content-title-block.style-faq .wp-block-accordion-heading__toggle:hover,
.content-title-block.style-faq .wp-block-accordion-heading__toggle[aria-expanded="true"],
.content-title-block.style-faq .wp-block-accordion-item.is-open .wp-block-accordion-heading__toggle {
	color: var(--faq-accent);
	background: none;
}
.content-title-block.style-faq .wp-block-accordion-heading__toggle:focus-visible {
	outline: 1px solid var(--faq-accent);
	outline-offset: 4px;
}
.content-title-block.style-faq .wp-block-accordion-heading__toggle-title {
	font: inherit;
	letter-spacing: normal;
	color: inherit;
	text-decoration: none;
}

/* Ikona: "+" z bloku, obrot do "x" */
.content-title-block.style-faq .wp-block-accordion-heading__toggle-icon {
	display: inline-block;
	position: static;
	flex: 0 0 24px;
	width: 24px;
	height: auto;
	margin: 0;
	text-align: center;
	font-size: 25px;
	font-weight: 300;
	line-height: 1;
	color: var(--faq-accent);
	background: none;
	transition: transform .35s var(--faq-ease);
}
/* motyw rysuje wlasny "+" w ::before - wylaczamy */
.content-title-block.style-faq .wp-block-accordion-heading__toggle-icon::before,
.content-title-block.style-faq .wp-block-accordion-heading__toggle-icon::after {
	content: none !important;
	display: none !important;
}
.content-title-block.style-faq .wp-block-accordion-heading__toggle[aria-expanded="true"] .wp-block-accordion-heading__toggle-icon,
.content-title-block.style-faq .wp-block-accordion-item.is-open .wp-block-accordion-heading__toggle-icon {
	transform: rotate(45deg);
}

/* --- Odpowiedz ------------------------------------------------------- */
/* Wylaczamy animacje motywu (grid 0fr/1fr) - nie dziala przy wielu akapitach
   i zostawia puste odstepy. Animacje robi faq-refined.js. */
.content-title-block.style-faq .wp-block-accordion .wp-block-accordion-item .wp-block-accordion-panel {
	display: block;
	box-sizing: border-box;
	max-width: 850px;
	margin: 0;
	padding: 0 var(--faq-panel-pr) 0 0;
	border: 0;
	background: none;
	opacity: 1;
	overflow: visible;
	transition: none;
}
/* odstep pod odpowiedzia jako element w srodku panelu - animuje sie razem z wysokoscia */
.content-title-block.style-faq .wp-block-accordion .wp-block-accordion-panel::after {
	content: "";
	display: block;
	height: 24px;
}
/* zamkniety panel */
.content-title-block.style-faq .wp-block-accordion .wp-block-accordion-item .wp-block-accordion-panel[hidden]:not(.is-faq-animating) {
	display: none;
}
/* na czas animacji (klasa dodawana przez faq-refined.js) */
.content-title-block.style-faq .wp-block-accordion .wp-block-accordion-item .wp-block-accordion-panel.is-faq-animating {
	display: block;
	content-visibility: visible;
	overflow: hidden;
	/* WP core zeruje padding na [hidden] z !important - trzymamy prawy, zeby tekst nie przeskakiwal */
	padding-right: var(--faq-panel-pr) !important;
}
.content-title-block.style-faq .wp-block-accordion-panel > * { margin-top: 0; }
.content-title-block.style-faq .wp-block-accordion-panel p,
.content-title-block.style-faq .wp-block-accordion-panel li {
	max-width: none;
	margin: 0 0 12px;
	padding: 0;
	font-family: "DM Sans", sans-serif;
	font-size: 15px;
	line-height: 1.7;
	color: var(--faq-body);
}
.content-title-block.style-faq .wp-block-accordion-panel > :last-child { margin-bottom: 0; }
.content-title-block.style-faq .wp-block-accordion-panel strong { font-weight: 600; color: var(--faq-ink); }
.content-title-block.style-faq .wp-block-accordion-panel a { color: var(--faq-accent); text-decoration: underline; text-underline-offset: 3px; }

/* --- Tablet / mobile ------------------------------------------------- */
@media (max-width: 1023px) {
	.content-title-block.style-faq { padding-top: 56px; padding-bottom: 56px; }
	.content-title-block.style-faq .content-title-block__container {
		grid-template-columns: minmax(0, 1fr);
		grid-template-rows: auto;
		row-gap: 0;
	}
	.content-title-block.style-faq .content-title-block__title,
	.content-title-block.style-faq .content-title-block__content,
	.content-title-block.style-faq .content-title-block__content-main { grid-column: 1; grid-row: auto; }
	.content-title-block.style-faq .content-title-block__content { margin-bottom: 36px; }
	.content-title-block.style-faq .content-title-block__content,
	.content-title-block.style-faq .content-title-block__content p { max-width: 420px; }
}
@media (max-width: 600px) {
	.content-title-block.style-faq .wp-block-accordion-heading__toggle { gap: 18px; padding: 20px 0; font-size: 15px; }
	.content-title-block.style-faq { --faq-panel-pr: 0px; }
	.content-title-block.style-faq .wp-block-accordion-panel p { font-size: 14px; }
}

@media (prefers-reduced-motion: reduce) {
	.content-title-block.style-faq * { transition: none !important; }
}