/* ==========================================================================
   Home Page Styles – PFP Solutions
   ========================================================================== */

/* --- Hero (home-page overrides — base styles in components.css) ---------- */
.pfp-hero {
    min-height: 100vh;
}

/* --- Feature grid -------------------------------------------------------- */
.pfp-feature-grid {
    padding: var(--pfp-section-y) 0;
    text-align: center;
}

.pfp-feature-grid__header {
    margin-bottom: 3rem;
}

.pfp-feature-grid .pfp-grid {
    grid-template-columns: repeat(3, 1fr);
}

@media (max-width: 768px) {
    .pfp-feature-grid .pfp-grid {
        grid-template-columns: 1fr;
    }
}

/* --- Deep dive sections -------------------------------------------------- */
.pfp-deep-dive {
    padding: var(--pfp-section-y) 0;
}

/* --- Stats bar ----------------------------------------------------------- */
.pfp-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--pfp-gap);
    text-align: center;
    padding: var(--pfp-section-y) 0;
}

@media (max-width: 768px) {
    .pfp-stats {
        grid-template-columns: repeat(2, 1fr);
    }
}

.pfp-stats__number {
    font-size: 2.5rem;
    font-weight: 800;
    color: var(--pfp-blue);
    line-height: 1;
    margin-bottom: .5rem;
}

.pfp-stats__label {
    font-size: .9375rem;
    color: var(--pfp-gray-500);
}

.pfp-section--dark .pfp-stats__label {
    color: var(--pfp-gray-400);
}