.bi-contact,
.bi-contact * { box-sizing: border-box; }

.bi-contact {
	--bi-contact-accent: #0bae7a;
	--bi-contact-accent-dark: #07885f;
	width: 100%;
	color: #111713;
	font-family: inherit;
	container: bi-contact / inline-size;
}
.bi-contact a { text-decoration: none; }

.bi-contact__masthead { position: relative; margin-bottom: 22px; padding-bottom: 15px; border-bottom: 1px solid #dfe6e2; }
.bi-contact__masthead::after { position: absolute; bottom: -1px; left: 0; width: 58px; height: 3px; content: ""; background: var(--bi-contact-accent); }
.bi-contact__masthead small { display: block; margin-bottom: 6px; color: var(--bi-contact-accent-dark); font-size: 9px; font-weight: 850; letter-spacing: .075em; line-height: 1; text-transform: uppercase; }
.bi-contact__masthead h1 { margin: 0 !important; color: #101512 !important; font-family: inherit !important; font-size: clamp(29px, 3vw, 40px) !important; font-weight: 780 !important; letter-spacing: -.025em !important; line-height: 1.08 !important; text-transform: none !important; }

.bi-contact__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.bi-contact-card { position: relative; display: grid; grid-template-columns: 62px minmax(0, 1fr); gap: 18px; align-items: center; min-height: 172px; overflow: hidden; padding: 27px; color: #111713 !important; background: #f4f7f5; border: 1px solid #dce6e1; border-radius: 11px; }
.bi-contact-card::after { position: absolute; top: -45px; right: -45px; width: 130px; height: 130px; content: ""; background: #e1f3eb; border-radius: 50%; }
.bi-contact-card__icon { position: relative; z-index: 1; display: block; width: 62px; height: 62px; background: var(--bi-contact-accent); border-radius: 50%; }
.bi-contact-card__icon--phone::before { position: absolute; top: 17px; left: 20px; width: 20px; height: 27px; content: ""; border: 4px solid #fff; border-top-width: 6px; border-bottom-width: 6px; border-radius: 11px 11px 13px 13px; transform: rotate(-36deg); }
.bi-contact-card__icon--email::before { position: absolute; top: 20px; left: 15px; width: 32px; height: 23px; content: ""; border: 3px solid #fff; border-radius: 3px; }
.bi-contact-card__icon--email::after { position: absolute; top: 18px; left: 21px; width: 19px; height: 19px; content: ""; border-right: 3px solid #fff; border-bottom: 3px solid #fff; transform: rotate(45deg); }
.bi-contact-card__copy { position: relative; z-index: 1; display: block; min-width: 0; }
.bi-contact-card__copy small { display: block; margin-bottom: 7px; color: var(--bi-contact-accent-dark); font-size: 9px; font-weight: 850; letter-spacing: .06em; line-height: 1; text-transform: uppercase; }
.bi-contact-card__copy strong { display: block; overflow-wrap: anywhere; color: #111713; font-size: clamp(18px, 2vw, 23px); font-weight: 770; letter-spacing: -.02em; line-height: 1.18; }
.bi-contact-card__copy > span { display: inline-flex; gap: 7px; align-items: center; margin-top: 13px; color: var(--bi-contact-accent-dark); font-size: 9px; font-weight: 850; letter-spacing: .04em; line-height: 1.2; text-transform: uppercase; }
.bi-contact-card__copy b { font-size: 16px; line-height: 1; }

@media (hover: hover) {
	.bi-contact-card:hover { background: #fff; border-color: #a9cfbe; box-shadow: 0 7px 22px rgba(14, 38, 27, .09); }
	.bi-contact-card:hover .bi-contact-card__icon { background: var(--bi-contact-accent-dark); }
}

@container bi-contact (max-width: 670px) {
	.bi-contact__grid { grid-template-columns: 1fr; }
	.bi-contact-card { min-height: 145px; }
}

@container bi-contact (max-width: 420px) {
	.bi-contact__masthead { margin-bottom: 16px; }
	.bi-contact__masthead h1 { font-size: 28px !important; }
	.bi-contact-card { grid-template-columns: 50px minmax(0, 1fr); gap: 14px; min-height: 126px; padding: 20px; }
	.bi-contact-card__icon { width: 50px; height: 50px; }
	.bi-contact-card__icon--phone::before { top: 13px; left: 16px; width: 17px; height: 23px; border-width: 3px; border-top-width: 5px; border-bottom-width: 5px; }
	.bi-contact-card__icon--email::before { top: 16px; left: 12px; width: 26px; height: 19px; }
	.bi-contact-card__icon--email::after { top: 15px; left: 17px; width: 16px; height: 16px; }
	.bi-contact-card__copy strong { font-size: 17px; }
	.bi-contact-card__copy > span { margin-top: 9px; }
}