/* =========================================================
   Секція: три колонки з іконками
   Макет «Kontakt» → Anfahrt
   ========================================================= */

.phm-info {
	padding-block: 140px;
}

.phm-info--beige { background: var(--phm-beige); }
.phm-info--white { background: var(--phm-white); }

.phm-info__title {
	margin: 0;
	text-align: center;
}

/* Вирівнювання керує всім блоком, не лише заголовком: у «Was Sie bei uns
   erwartet» іконки й підписи стоять по центру колонки (правка від 28.08),
   а в «Anfahrt» на контактах абзаци довгі — там лівий край. */
.phm-info--center .phm-info__item {
	text-align: center;
}

.phm-info--center .phm-info__icon {
	margin-inline: auto;
}

.phm-info--left .phm-info__title {
	text-align: left;
}

.phm-info__grid {
	margin: 80px 0 0;
	padding: 0;
	list-style: none;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 64px;
}

.phm-info__icon {
	color: var(--phm-primary-dark);
}

.phm-info__item-title {
	font-family: var(--phm-font-body);
	font-weight: 600;
	font-size: 17px;
	line-height: 1.4;
	color: var(--phm-primary-dark);
	margin: 24px 0 0;
}

.phm-info__text {
	margin: 12px 0 0;
	font-size: 15px;
	line-height: 1.7;
	color: var(--phm-text);
}

/* ---- Адаптив ---- */

.phm-info__grid--cols-2 {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

/* Чотири колонки в макеті стоять з проміжком 48px — на 64 вони б тіснили текст. */
.phm-info__grid--cols-4 {
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 48px;
}

@media (max-width: 1024px) {
	.phm-info {
		padding-block: 88px;
	}

	.phm-info__grid,
	.phm-info__grid--cols-2,
	.phm-info__grid--cols-4 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 40px;
		margin-top: 48px;
	}
}

@media (max-width: 767px) {
	.phm-info {
		padding-block: 56px;
	}

	.phm-info__grid,
	.phm-info__grid--cols-2,
	.phm-info__grid--cols-4 {
		grid-template-columns: minmax(0, 1fr);
		gap: 32px;
		margin-top: 32px;
	}

	.phm-info__title {
		text-align: left;
	}
}