/* "Защо Health Guard" — consolidated USP section. Uses the site's own tokens
   (--dark-teal / --accent / --light-green / --gray-sky, Atyp + Inter, radii). */

.hg-why { margin-top: var(--s6); padding: 0 var(--s2); }
.hg-why-inner { max-width: 1440px; margin: 0 auto; }
.hg-why .heading { margin-top: var(--s5); }

/* trust strip — the two claims as calm pills */
.hg-why-claims {
	list-style: none; margin: var(--s4) 0 0; padding: 0;
	display: flex; flex-wrap: wrap; gap: var(--s2);
}
.hg-why-claim {
	display: flex; flex-direction: column; gap: 4px;
	background: var(--light-sky); border: 1px solid var(--accent);
	border-radius: var(--element-radius); padding: var(--s2) var(--s3); flex: 1 1 320px;
}
.hg-why-claim-title { font-family: AtypText, sans-serif; font-weight: 600; font-size: 1.15rem; color: var(--dark-teal); line-height: 1.25; }
.hg-why-claim-tags { font-family: Inter, sans-serif; font-weight: 300; font-size: .95rem; color: #4a6a72; }

/* three promises — cards */
.hg-why-promises {
	margin-top: var(--s4);
	display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--s3);
}
.hg-why-promise {
	position: relative; display: flex; flex-direction: column;
	background: var(--gray-sky); border-radius: var(--heading-radius);
	padding-bottom: calc(var(--s6) + var(--s1)); overflow: hidden;
	transition: transform .3s ease, box-shadow .3s ease;
}
.pc .hg-why-promise:hover { transform: translateY(-4px); box-shadow: 0 12px 28px rgba(15,84,101,.12); }
.hg-why-promise-media { display: block; width: 100%; aspect-ratio: 16 / 9; overflow: hidden; background: var(--light-sky); }
.hg-why-promise-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hg-why-promise-title { font-family: AtypText, sans-serif; font-weight: 600; font-size: 1.35rem; line-height: 1.2; color: var(--dark-teal); margin: var(--s3) var(--s3) var(--s1); }
.hg-why-promise-text { font-family: Inter, sans-serif; font-weight: 300; font-size: 1rem; line-height: 1.5; color: var(--text-color); margin: 0 var(--s3); }
.hg-why-promise-link {
	position: absolute; left: var(--s3); bottom: var(--s3);
	width: 40px; height: 40px; border-radius: 50%; background: var(--dark-teal);
	display: inline-flex; align-items: center; justify-content: center; transition: transform .3s ease;
}
.hg-why-promise-link svg { width: 14px; height: auto; }
.hg-why-promise-link svg * { fill: var(--light-green) !important; }
.hg-why-promise-link:hover { transform: translateX(4px); }

/* four advantages — compact numbered row */
.hg-why-advantages {
	margin-top: var(--s3);
	display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--s3) var(--s2);
	padding-top: var(--s4); border-top: 1px solid var(--dirty-sky);
}
.hg-why-adv { display: flex; gap: var(--s2); align-items: flex-start; }
.hg-why-adv-num { font-family: AtypText, sans-serif; font-weight: 900; font-size: 1.6rem; line-height: 1; color: var(--accent); -webkit-text-stroke: 1px var(--dark-teal); }
.hg-why-adv-title { font-family: AtypText, sans-serif; font-weight: 600; font-size: 1.05rem; line-height: 1.2; color: var(--dark-teal); margin: 0 0 4px; }
.hg-why-adv-text { font-family: Inter, sans-serif; font-weight: 300; font-size: .92rem; line-height: 1.45; color: var(--text-color); margin: 0; }

.hg-why-cta { margin-top: var(--s5); }

/* tablet */
@media (max-width: 1024px) {
	.hg-why-promises { grid-template-columns: 1fr 1fr; }
	.hg-why-advantages { grid-template-columns: 1fr 1fr; }
}
/* phone */
@media (max-width: 640px) {
	.hg-why { padding: 0 var(--s1); }
	.hg-why-promises { grid-template-columns: 1fr; gap: var(--s2); }
	.hg-why-advantages { grid-template-columns: 1fr; gap: var(--s3); }
	.hg-why-claim { flex-basis: 100%; }
}

@media (prefers-reduced-motion: reduce) {
	.hg-why-promise, .hg-why-promise-link { transition: none; }
}