/* Values flexible-content block. */
.values-block { --fa-values-icon: none; padding: 96px 0; background: var(--fa-color-primary-very-light); }
.values-block__intro { display: grid; grid-template-columns: minmax(0, 800px) auto; gap: 48px; align-items: end; justify-content: space-between; margin-bottom: 48px; }
.values-block__copy { min-width: 0; }
.values-block__eyebrow { margin: 0 0 16px; color: var(--fa-color-primary); font-size: 13px; line-height: 1.4; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.values-block__title { margin: 0; color: var(--fa-color-text); font-family: var(--fa-font-body); font-size: 64px; line-height: .99; font-weight: 500; letter-spacing: -.035em; text-shadow: 2px 2px 0 #fff; }
html[lang^="nl"] .values-block__title { font-size: 58px; line-height: 1; }
.values-block__title em { color: var(--fa-color-primary); font-style: normal; text-decoration: none; }
.values-block__text { max-width: 680px; margin-top: 22px; color: var(--fa-color-text); font-size: 16px; line-height: 1.65; }
.values-block__text > :first-child, .values-block__card-text > :first-child { margin-top: 0; }
.values-block__text > :last-child, .values-block__card-text > :last-child { margin-bottom: 0; }
.values-block__action { justify-self: end; padding-bottom: 3px; }
.values-block__button { display: inline-flex; gap: 12px; align-items: center; min-height: 48px; padding: 5px 6px 5px 18px; color: var(--fa-color-primary); background: var(--fa-color-background); border: 1px solid var(--fa-color-primary); border-radius: 999px; font-size: 15px; line-height: 1; font-weight: 600; text-decoration: none; transition: color .25s ease, background-color .25s ease, transform .25s ease; }
.values-block__button:hover { color: var(--fa-color-background); background: var(--fa-color-primary); text-decoration: none; transform: translateY(-2px); }
.values-block__arrow { display: inline-flex; flex: 0 0 36px; align-items: center; justify-content: center; width: 36px; height: 36px; color: var(--fa-color-background); background: var(--fa-color-primary); border-radius: 50%; transition: color .25s ease, background-color .25s ease; }
.values-block__button:hover .values-block__arrow { color: var(--fa-color-primary); background: var(--fa-color-background); }
.values-block__arrow-icon { display: block; width: 13px; height: 13px; background: currentColor; -webkit-mask: url("../../images/right-arrow.svg") center / contain no-repeat; mask: url("../../images/right-arrow.svg") center / contain no-repeat; transform: rotate(-45deg); transition: transform .25s ease; }
.values-block__button:hover .values-block__arrow-icon { transform: rotate(0deg); }
.values-block__grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 16px; }
.values-block__card { position: relative; grid-column: span 2; min-height: 190px; padding: 28px; overflow: hidden; color: var(--fa-color-text); background: rgba(255, 255, 255, .68); border: 1px solid rgba(0, 101, 177, .18); border-radius: 18px; box-shadow: 0 18px 44px rgba(0, 45, 79, .09), inset 0 1px 0 rgba(255, 255, 255, .94), inset 0 -1px 0 rgba(0, 101, 177, .08); -webkit-backdrop-filter: blur(20px) saturate(165%); backdrop-filter: blur(20px) saturate(165%); transition: color .3s ease, background-color .3s ease, border-color .3s ease, transform .3s ease, box-shadow .3s ease; }
.values-block__card::before { position: absolute; top: 0; right: 18px; left: 18px; height: 1px; content: ""; pointer-events: none; background: rgba(255, 255, 255, .92); opacity: 1; transition: opacity .3s ease; }
.values-block__card > * { position: relative; z-index: 1; }
.values-block__card:hover { color: var(--fa-color-background); background: var(--fa-color-primary); border-color: var(--fa-color-primary); box-shadow: 0 24px 48px rgba(0, 71, 126, .24), inset 0 1px 0 rgba(255, 255, 255, .42); transform: translateY(-6px); }
.values-block__card:hover::before { opacity: .42; }
.values-block__card-heading { display: flex; gap: 20px; align-items: flex-start; min-width: 0; }
.values-block__card-icon { flex: 0 0 34px; width: 34px; height: 34px; background-color: var(--fa-color-primary); -webkit-mask: var(--fa-values-icon) center / contain no-repeat; mask: var(--fa-values-icon) center / contain no-repeat; transition: background-color .3s ease, transform .3s ease; }
.values-block__card:hover .values-block__card-icon { background-color: var(--fa-color-background); transform: translateY(-2px) scale(1.05); }
.values-block__card-title { flex: 1 1 auto; min-width: 0; margin: 0; color: inherit; font-family: var(--fa-font-body); font-size: 24px; line-height: 1.2; font-weight: 700; letter-spacing: -.02em; }
.values-block__card-text { margin-top: 28px; color: rgba(0, 0, 0, .72); font-size: 14px; line-height: 1.55; transition: color .3s ease; }
.values-block__card:hover .values-block__card-text { color: rgba(255, 255, 255, .88); }
.values-block__grid--1 .values-block__card { grid-column: span 6; }
.values-block__grid--2 .values-block__card, .values-block__grid--4 .values-block__card { grid-column: span 3; }
.values-block__grid--5 .values-block__card:nth-child(n+4) { grid-column: span 3; }
@media (max-width: 900px) {
	.values-block { padding: 80px 0; }
	.values-block__intro { grid-template-columns: minmax(0, 1fr); gap: 28px; }
	.values-block__title { font-size: 52px; }
	html[lang^="nl"] .values-block__title { font-size: 48px; }
	.values-block__action { justify-self: start; }
	.values-block__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.values-block__grid[class*="values-block__grid--"] .values-block__card { grid-column: span 1; }
	.values-block__grid .values-block__card:last-child:nth-child(odd) { grid-column: span 2; }
}
@media (max-width: 600px) {
	.values-block { padding: 64px 0; }
	.values-block__intro { margin-bottom: 36px; }
	.values-block__title { font-size: 44px; line-height: 1.02; }
	html[lang^="nl"] .values-block__title { font-size: 38px; line-height: 1.03; }
	.values-block__text { margin-top: 20px; }
	.values-block__grid { grid-template-columns: minmax(0, 1fr); gap: 12px; }
	.values-block__grid[class*="values-block__grid--"] .values-block__card, .values-block__grid .values-block__card:last-child:nth-child(odd) { grid-column: 1 / -1; }
	.values-block__card { min-height: 170px; padding: 24px; }
	.values-block__card-title { font-size: 22px; }
	.values-block__card-text { margin-top: 20px; }
}
@media (prefers-reduced-motion: reduce) {
	.values-block__button, .values-block__arrow, .values-block__arrow-icon, .values-block__card, .values-block__card::before, .values-block__card-icon, .values-block__card-text { transition: none; }
}
