/*
 * Information pages built from page patterns, and 404 (inc/pages.php loads this on pages and 404):
 * «Для організацій» bti-child/inclusivity (Figma 20:1929 / 20:1344), its institution subpage
 * bti-child/inclusivity-schools (21:2842 / 21:2345), «Про нас» bti-child/about (23:4042 / 23:1329),
 * «Контакти» bti-child/contacts (24:1459 / 24:1329), «Заявку надіслано» bti-child/thanks
 * (25:1496 / 25:1406) and 404.php (25:1655 / 25:1579).
 *
 * Shared pieces: .pg-section (40 / 80 px vertical padding), .pg-hero, .pg-sheet (white band),
 * .pg-dark (graphite band), .pg-order (copy + order form), .pg-faq, .pg-checks, .pg-photo.
 */

.pg-section {
	padding-block: 40px;
}

:where(.pg-section) h2 {
	margin: 0 0 20px;
}

:where(.pg-section) p {
	margin: 0;
}

.pg-sheet {
	background: var(--c-sheet);
}

.pg-dark {
	background: var(--c-graphite);
	color: var(--c-sheet);
}

.pg-dark h2 {
	color: var(--c-sheet);
}

.pg-dark p {
	color: var(--c-hatch);
}

/* ---------- First screen ---------- */
.pg-hero {
	padding-top: 20px;
	padding-bottom: 40px;
}

.pg-hero--tint {
	background: var(--c-ink-tint);
}

.pg-hero__inner {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.pg-hero__inner > *,
.pg-hero__text > * {
	margin: 0;
}

.pg-hero__row {
	display: flex;
	flex-direction: column;
	gap: var(--space-5);
}

.pg-hero__text {
	display: flex;
	flex-direction: column;
	gap: var(--space-4);
}

.pg-hero__lead {
	color: var(--c-graphite-soft);
}

.pg-hero__lead.is-strong {
	color: var(--c-graphite);
}

.pg-hero__buttons {
	margin: var(--space-1) 0 0;
}

.pg-hero__buttons .wp-block-button,
.pg-hero__buttons .wp-block-button__link {
	width: 100%;
}

.pg-hero__photo {
	height: 260px;
}

/* «ухил 1:12» runs along the ramp: the line is tilted as in Figma. */
.pg-hero__photo.is-slope .bti-dim--h {
	top: 32px;
	left: 15%;
	right: 15%;
	transform: rotate(5deg);
}

/* Facts under the lead («ціна / за КП», «термін», «норматив»). */
.pg-facts {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-3) var(--space-6);
}

.pg-fact {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.pg-fact > * {
	margin: 0;
}

.pg-fact__label {
	color: var(--c-graphite-soft);
	font-family: var(--font-measure);
	word-spacing: var(--ws-measure);
	font-size: var(--fs-measure-s);
	line-height: var(--lh-measure-s);
}

.pg-fact__value {
	font-family: var(--font-measure);
	word-spacing: var(--ws-measure);
	font-size: var(--fs-measure-l);
	font-weight: 500;
	line-height: var(--lh-measure-l);
}

/* Photos without dimension lines (bti/measured-photo with empty labels). */
.pg-photo.bti-measured-photo {
	height: 240px;
}

/* ---------- Audience cards (UI kit «Картка послуги» with static copy) ---------- */
.pg-cards {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--space-4);
	margin: 0;
	padding: 0;
	list-style: none;
}

.pg-card {
	margin: 0;
}

/* The card icon is the theme's SVG as a mask, so the editor can keep plain blocks. */
.pg-card::before {
	content: "";
	display: block;
	width: 32px;
	height: 32px;
	background: var(--c-graphite);
	-webkit-mask: var(--pg-card-icon) center / contain no-repeat;
	mask: var(--pg-card-icon) center / contain no-repeat;
}

.pg-card--door {
	--pg-card-icon: url("../../icons/door.svg");
}

.pg-card--window {
	--pg-card-icon: url("../../icons/window.svg");
}

.pg-card--stairs {
	--pg-card-icon: url("../../icons/stairs.svg");
}

.pg-card--ramp {
	--pg-card-icon: url("../../icons/ramp.svg");
}

/* Audience cards on the inclusivity page: every icon is ink (Figma 20:1929 / 20:1344). */
.pg-card--door::before,
.pg-card--window::before,
.pg-card--stairs::before,
.pg-card--ramp::before {
	background: var(--c-ink);
}

/* A linked card title covers the card (as bti_service_card()). */
.pg-card .bti-service-card__title a::after {
	content: "";
	position: absolute;
	inset: 0;
}

.pg-card .bti-service-card__foot > * {
	margin: 0;
}

/* ---------- «Що перевіряємо» / «Що особливо важливо»: items under a graphite rule ---------- */
.pg-checks {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 20px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.pg-check {
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin: 0;
	padding-top: 14px;
	border-top: 1px solid var(--c-graphite);
}

.pg-check > * {
	margin: 0;
}

.pg-check h3 {
	font-size: var(--fs-h3);
	line-height: var(--lh-h3);
}

.pg-check p {
	color: var(--c-graphite-soft);
	font-size: var(--fs-small);
	line-height: var(--lh-small);
}

/* ---------- Steps ---------- */
.pg-steps .bti-steps {
	margin: 0;
}

/* ---------- Copy + form (КП request on the inclusivity pages; quick question on contacts) ---------- */
.pg-order__inner {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.pg-order__intro h2 {
	margin-bottom: 14px;
}

.pg-order__intro p {
	font-size: var(--fs-body);
	line-height: var(--lh-body);
}

.pg-sheet.pg-order .pg-order__intro p {
	color: var(--c-graphite-soft);
}

.pg-order__form {
	min-width: 0;
	scroll-margin-top: var(--space-4);
	color: var(--c-graphite);
}

.pg-order__form .bti-order-form {
	max-width: none;
}

/* ---------- FAQ ---------- */
.pg-faq__inner {
	display: flex;
	flex-direction: column;
}

.pg-faq__inner > h2 {
	margin-bottom: var(--space-2);
}

.pg-faq .bti-faq {
	margin: 0;
}

/* ---------- Institution subpage: features + photo and note ---------- */
.pg-features {
	padding-top: 0;
}

.pg-features__inner {
	display: flex;
	flex-direction: column;
	gap: var(--space-6);
}

.pg-features__main > h2 {
	margin-bottom: 18px;
}

.pg-checks.is-stacked {
	gap: 18px;
}

.pg-features__aside {
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.pg-note {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 18px 20px;
	border: 1px solid var(--c-hatch);
	background: var(--c-sheet);
}

.pg-note > * {
	margin: 0;
}

.pg-note__title {
	font-size: var(--fs-button);
	line-height: var(--lh-button);
	font-weight: 500;
}

.pg-note__list {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 0;
	list-style: none;
	font-size: var(--fs-small);
	line-height: var(--lh-small);
}

.pg-note__list li {
	margin: 0;
}

.pg-note__list li::before {
	content: "— ";
}

/* ---------- About: dimension line, team, documents, photos, call to action ---------- */
.pg-hero__dim {
	margin-top: var(--space-1) !important;
}

.pg-team {
	padding-top: var(--space-2);
}

.pg-team__list {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--space-6) var(--space-5);
	margin: 0;
	padding: 0;
	list-style: none;
}

.pg-team__list > .bti-engineer {
	margin: 0;
}

/* The portrait is a bti/measured-photo block: keep the UI kit proportion (282 × 300). */
.bti-engineer > .bti-measured-photo {
	height: auto;
	aspect-ratio: 282 / 300;
}

.pg-docs__inner {
	display: flex;
	flex-direction: column;
	gap: var(--space-6);
}

.pg-docs__text h2 {
	margin-bottom: 14px;
}

.pg-docs__lead {
	margin-bottom: 14px !important;
	color: var(--c-graphite-soft);
}

/* Requisites: a drawing title block (Figma 23:5402). */
.pg-requisites {
	margin: 0;
	overflow-x: auto;
}

.pg-requisites table {
	width: 100%;
	border: 1px solid var(--c-graphite);
	border-collapse: collapse;
	table-layout: fixed;
}

.pg-requisites td {
	padding: 8px 12px;
	border: 0;
	border-bottom: 1px solid var(--c-hatch);
	color: var(--c-graphite);
	font-family: var(--font-measure);
	word-spacing: var(--ws-measure);
	font-size: var(--fs-measure);
	font-weight: 500;
	line-height: var(--lh-measure);
	vertical-align: top;
	overflow-wrap: anywhere;
}

.pg-requisites td:first-child {
	width: 102px;
	padding-right: 0;
	color: var(--c-graphite-soft);
	font-size: var(--fs-measure-s);
	line-height: var(--lh-measure-s);
}

.pg-requisites tr:last-child td {
	border-bottom: 0;
}

.pg-docs__photos {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--space-4);
}

.pg-docs__photos .pg-photo.bti-measured-photo {
	height: 200px;
}

.pg-onsite__photos {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--space-4);
}

.pg-cta__inner {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.pg-cta__text {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.pg-cta__text > * {
	margin: 0 !important;
}

.pg-cta__text p {
	font-size: var(--fs-body);
	line-height: var(--lh-body);
}

.pg-cta__buttons {
	margin: 0;
}

.pg-cta__buttons .wp-block-button,
.pg-cta__buttons .wp-block-button__link {
	width: 100%;
}

/* ---------- Contacts: the NAP card and the map (side by side from 1024 px, theme-blocks.css) ---------- */
@media (max-width: 1023.98px) {
	.pg-contacts .bti-find-us--card .bti-map {
		height: 280px;
	}
}

/* ---------- Thank-you page ---------- */
.pg-thanks {
	padding-top: 28px;
}

.pg-thanks__inner {
	display: flex;
	flex-direction: column;
	gap: var(--space-6);
}

.pg-thanks__main {
	display: flex;
	flex-direction: column;
	gap: var(--space-4);
}

.pg-thanks__main > * {
	margin: 0;
}

.pg-thanks__subtitle {
	font-size: var(--fs-h3);
	line-height: var(--lh-h3);
	font-weight: 500;
	letter-spacing: var(--ls-h3);
}

.pg-thanks .bti-steps.is-1-col {
	grid-template-columns: minmax(0, 1fr);
	gap: var(--space-3);
}

.pg-thanks__buttons {
	gap: var(--space-3);
}

.pg-thanks__buttons .wp-block-button,
.pg-thanks__buttons .wp-block-button__link {
	width: 100%;
}

.pg-thanks__aside {
	display: flex;
	flex-direction: column;
	gap: var(--space-3);
	padding: 20px;
	border: 1px solid var(--c-graphite);
	background: var(--c-sheet);
}

.pg-thanks__aside > * {
	margin: 0;
}

.pg-thanks__aside p {
	color: var(--c-graphite-soft);
	font-size: var(--fs-small);
	line-height: var(--lh-small);
}

.pg-thanks__aside .pg-thanks__caption {
	font-family: var(--font-measure);
	word-spacing: var(--ws-measure);
	font-size: var(--fs-measure-s);
	line-height: var(--lh-measure-s);
}

/* ---------- 404 ---------- */
.pg-404 {
	padding-top: 28px;
}

.pg-404__inner {
	display: flex;
	flex-direction: column;
	gap: var(--space-6);
}

.pg-404__main {
	display: flex;
	flex-direction: column;
	gap: var(--space-4);
}

.pg-404__main > * {
	margin: 0;
}

.pg-404__code {
	color: var(--c-ink);
	font-family: var(--font-measure);
	word-spacing: var(--ws-measure);
	font-size: var(--fs-measure-l);
	font-weight: 500;
	line-height: var(--lh-measure-l);
}

.pg-404__buttons {
	display: flex;
	flex-direction: column;
	gap: var(--space-3);
}

.pg-404__nav-title {
	margin: 0 0 var(--space-2);
	color: var(--c-graphite-soft);
	font-size: var(--fs-small);
	line-height: var(--lh-small);
}

.pg-404__links {
	display: flex;
	flex-wrap: wrap;
	gap: 0 var(--space-5);
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: var(--fs-label);
	line-height: var(--lh-label);
	font-weight: 500;
}

.pg-404__links a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	color: var(--c-ink);
}

.pg-404__drawing {
	display: flex;
	flex-direction: column;
	gap: var(--space-2);
}

.pg-404__room {
	display: grid;
	place-items: center;
	height: 190px;
	padding: var(--space-4);
	border: 2px dashed var(--c-graphite);
	color: var(--c-graphite-soft);
	font-family: var(--font-measure);
	word-spacing: var(--ws-measure);
	font-size: var(--fs-measure-s);
	line-height: var(--lh-measure-s);
	text-align: center;
}

/* ---------- Tablet ---------- */
@media (min-width: 768px) {
	.pg-cards {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: var(--space-5);
	}

	.pg-checks {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: var(--space-6);
	}

	.pg-checks.is-stacked {
		grid-template-columns: minmax(0, 1fr);
		gap: 18px;
	}

	.pg-team__list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.pg-onsite__photos {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: var(--space-5);
	}

	.pg-hero__buttons .wp-block-button,
	.pg-hero__buttons .wp-block-button__link,
	.pg-cta__buttons .wp-block-button,
	.pg-cta__buttons .wp-block-button__link,
	.pg-thanks__buttons .wp-block-button,
	.pg-thanks__buttons .wp-block-button__link {
		width: auto;
	}

	.pg-404__buttons {
		flex-direction: row;
	}
}

/* ---------- Desktop ---------- */
@media (min-width: 1024px) {
	.pg-section {
		padding-block: 80px;
	}

	:where(.pg-section) h2 {
		margin-bottom: var(--space-6);
	}

	.pg-hero {
		padding-top: 40px;
		padding-bottom: 80px;
	}

	.pg-hero__inner {
		gap: var(--space-6);
	}

	.pg-hero__row {
		flex-direction: row;
		align-items: center;
		gap: var(--space-8);
	}

	.pg-hero__row > .pg-hero__text {
		flex: 0 0 560px;
	}

	.pg-hero__text {
		gap: var(--space-5);
	}

	.pg-hero__text--wide {
		max-width: 880px;
	}

	.pg-hero__buttons {
		margin-top: 0;
	}

	.pg-hero__photo {
		flex: 1 1 576px;
		height: 440px;
	}

	.pg-hero__photo.is-slope .bti-dim--h {
		top: 76px;
		left: 17%;
		right: 17%;
	}

	.pg-cards {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.pg-checks {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.pg-order__inner {
		flex-direction: row;
		align-items: flex-start;
		gap: var(--space-8);
	}

	/* The heading and text stay in view while the longer right column scrolls past. */
	.pg-order__intro {
		flex: 0 0 460px;
		position: sticky;
		top: var(--sticky-top);
	}

	.pg-question .pg-order__intro {
		flex-basis: 440px;
	}

	.pg-order__form {
		flex: 1 1 auto;
	}

	.pg-faq__inner {
		flex-direction: row;
		align-items: flex-start;
		gap: var(--space-8);
	}

	.pg-faq__inner > h2 {
		flex: 0 0 380px;
		margin: 0;
		position: sticky;
		top: var(--sticky-top);
	}

	.pg-faq .bti-faq {
		flex: 1 1 auto;
		min-width: 0;
	}

	.pg-faq.is-stacked .pg-faq__inner {
		flex-direction: column;
		gap: 0;
	}

	.pg-faq.is-stacked .pg-faq__inner > h2 {
		position: static;
		flex: none;
		margin-bottom: var(--space-6);
	}

	.pg-faq.is-stacked .bti-faq {
		width: 100%;
	}

	.pg-features {
		padding-top: 0;
	}

	.pg-features__inner {
		flex-direction: row;
		align-items: flex-start;
		gap: var(--space-8);
	}

	.pg-features__main {
		flex: 0 0 640px;
	}

	.pg-features__aside {
		flex: 1 1 auto;
		min-width: 0;
	}

	.pg-features__photo.bti-measured-photo {
		height: 320px;
	}

	.pg-team {
		padding-top: var(--space-5);
	}

	.pg-team__list {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.pg-docs__inner {
		flex-direction: row;
		align-items: flex-start;
		gap: var(--space-8);
	}

	.pg-docs__text {
		flex: 0 0 520px;
	}

	.pg-docs__photos {
		flex: 1 1 auto;
		min-width: 0;
	}

	.pg-docs__photos .pg-photo.bti-measured-photo {
		height: 320px;
	}

	.pg-onsite .pg-photo.bti-measured-photo {
		height: 380px;
	}

	.pg-cta__inner {
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
	}

	.pg-thanks,
	.pg-404 {
		padding-top: var(--space-9);
		padding-bottom: 120px;
	}

	.pg-thanks__inner,
	.pg-404__inner {
		flex-direction: row;
		align-items: flex-start;
		gap: var(--space-9);
	}

	.pg-thanks__main,
	.pg-404__main {
		flex: 0 0 640px;
		gap: var(--space-5);
	}

	.pg-thanks__aside,
	.pg-404__drawing {
		flex: 1 1 auto;
		min-width: 0;
	}

	.pg-404__room {
		height: 320px;
	}
}

/* ---------- Services page (pattern bti-child/services) ---------- */
.pg-section.pg-services {
	padding-top: 0;
}

.pg-services .bti-services-grid {
	margin: 0;
}

.pg-services__more {
	margin: var(--space-5) 0 0;
}

@media (max-width: 767.98px) {
	.pg-services__more .wp-block-button,
	.pg-services__more .wp-block-button__link {
		width: 100%;
	}
}