.fonte-project-pillars,
.fonte-project-pillars * { box-sizing: border-box; }
.fonte-project-pillars { position: relative; z-index: 4; width: 100%; padding: 5.5rem var(--fonte-public-inline-gutter) 6.5rem; overflow: hidden; background: var(--fonte-web-white); }
.fonte-project-pillars__inner { display: flex; width: 100%; max-width: var(--fonte-public-content-max-width); margin: 0 auto; flex-direction: column; align-items: center; gap: clamp(1.875rem, 3.6vw, 3.25rem); }
.fonte-project-pillars__header { display: flex; flex-direction: column; align-items: center; gap: 0.875rem; text-align: center; }
.fonte-project-pillars__heading-icon { display: inline-flex; width: 2.75rem; height: 2.75rem; flex: none; align-items: center; justify-content: center; border: var(--fonte-border-width) solid var(--fonte-web-accent); border-radius: var(--fonte-token-radius-pill); color: var(--fonte-web-accent); }
.fonte-project-pillars__heading-icon svg { width: 1.25rem; height: 1.25rem; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2; }
.fonte-project-pillars h2 { margin: 0; color: var(--fonte-web-ink); font-family: var(--fonte-project-pillars-heading-font-family); font-size: var(--fonte-project-pillars-heading-font-size); font-weight: var(--fonte-project-pillars-heading-font-weight); letter-spacing: var(--fonte-project-pillars-heading-letter-spacing); line-height: var(--fonte-project-pillars-heading-line-height); }
.fonte-project-pillars__grid { display: grid; width: 100%; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(1.125rem, 2.2vw, 1.75rem); }
.fonte-project-pillars__card { position: relative; z-index: 1; display: flex; min-width: 0; margin: 0; padding: clamp(1.375rem, 2.2vw, 2rem); flex-direction: column; align-items: flex-start; gap: 0.75rem; border: var(--fonte-border-width) solid var(--fonte-web-accent-38); border-radius: 1.625rem; background: var(--fonte-web-white); color: inherit; cursor: pointer; font: inherit; text-align: left; transform: translateZ(0); transition: transform var(--fonte-pillar-hover-transition), border-color var(--fonte-pillar-hover-transition), box-shadow var(--fonte-pillar-hover-transition); }
.fonte-project-pillars__icon { width: 1.875rem; height: 1.875rem; color: var(--fonte-web-accent); fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2; }
.fonte-project-pillars__card h3 { margin: 0; color: var(--fonte-web-ink); font-family: var(--fonte-pillar-title-font-family); font-size: var(--fonte-pillar-title-font-size); font-weight: var(--fonte-pillar-title-font-weight); line-height: var(--fonte-pillar-title-line-height); }
.fonte-project-pillars__card p { margin: 0; color: var(--fonte-web-ink-soft); font-family: var(--fonte-pillar-copy-font-family); font-size: var(--fonte-pillar-copy-font-size); font-weight: var(--fonte-pillar-copy-font-weight); line-height: var(--fonte-pillar-copy-line-height); text-wrap: pretty; }
@media (min-width: 75.001rem) and (hover: hover) and (pointer: fine) {
    .fonte-project-pillars__card:hover,
    .fonte-project-pillars__card:focus-visible { z-index: 2; outline: 0; border-color: var(--fonte-web-accent); box-shadow: var(--fonte-pillar-card-hover-shadow); transform: translateY(-0.3125rem) scale(1.01); }
}
@media (max-width: 51.25rem) {
    .fonte-project-pillars { padding-block: 4rem 4.5rem; }
    .fonte-project-pillars__inner,
    .fonte-project-pillars__header { align-items: flex-start; text-align: left; }
    .fonte-project-pillars__heading-icon { width: 3.5rem; height: 3.5rem; }
    .fonte-project-pillars__heading-icon svg { width: 1.625rem; height: 1.625rem; }
    .fonte-project-pillars__grid { grid-template-columns: minmax(0, 1fr); gap: 1rem; }
}
@media (prefers-reduced-motion: reduce) {
    .fonte-project-pillars__card { transition: none; }
}