/**
 * Shared hover motion and consistent home/content typography.
 * Titles use one tight tracking and FCJ navy. Body copy on light sections is slate.
 */

main h1,
main h2,
main h3,
main .fcj-home-title,
main .fcj-mv-title,
main .fcj-section-title {
    letter-spacing: -0.02em;
}

main h1.font-bold,
main h2.font-bold,
main h3.font-bold,
main h1.font-extrabold,
main h2.font-extrabold,
main h3.font-extrabold,
main .fcj-home-title,
main .fcj-section-title {
    color: #1C3A6C;
    -webkit-text-fill-color: #1C3A6C;
}

main .fcj-home-lead {
    color: #334155;
}

main .fcj-values-grid h3,
main .fcj-invest-card h3 {
    color: #1C3A6C;
    letter-spacing: -0.02em;
    -webkit-text-fill-color: #1C3A6C;
}

main .fcj-values-grid p {
    color: #334155;
}

main .fcj-page-hero h1,
main .fcj-page-hero h1.font-extrabold,
main .fcj-page-hero h2,
main .fcj-band-navy h1,
main .fcj-band-navy h2,
main .fcj-band-navy h3,
main .fcj-home-title.on-dark,
main .fcj-band-navy .fcj-home-title,
main .fcj-foundation .fcj-mv-title,
main .fcj-foundation .fcj-values > h2,
main .text-white h1,
main .text-white h2,
main .text-white h3,
main .fcj-oval-copy,
main .fcj-oval-copy p {
    color: #fff;
    -webkit-text-fill-color: #fff;
}

main .fcj-band-navy .fcj-home-lead,
main .fcj-page-hero p,
main .text-white p,
main .fcj-foundation .fcj-mv-text {
    color: rgba(255, 255, 255, 0.92);
}

.dark main h1.font-bold,
.dark main h2.font-bold,
.dark main h3.font-bold,
.dark main h1.font-extrabold,
.dark main h2.font-extrabold,
.dark main h3.font-extrabold,
.dark main .fcj-home-title:not(.on-dark) {
    color: #fff;
    -webkit-text-fill-color: #fff;
}

.dark main .fcj-values-grid h3 {
    color: #1C3A6C;
    -webkit-text-fill-color: #1C3A6C;
}

.dark main .fcj-home-lead {
    color: #cbd5e1;
}

.dark main .fcj-band-navy .fcj-home-lead,
.dark main .fcj-page-hero p {
    color: rgba(255, 255, 255, 0.92);
}

main .fcj-hover-media {
    overflow: hidden;
}

.fcj-layout-bar button {
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

@media (hover: hover) and (prefers-reduced-motion: no-preference) {
    .fcj-layout-bar button:hover {
        background: #1C3A6C;
        color: #fff;
        border-color: #1C3A6C;
        transform: translateY(-2px);
        box-shadow: 0 8px 16px rgba(1, 27, 85, 0.22);
    }

    .fcj-layout-bar button.is-on:hover {
        background: #0052D9;
        border-color: #0052D9;
    }

    main .fcj-board-card:hover img,
    main .fcj-coopted-photo:hover img,
    main .fcj-dept:hover img,
    main .fcj-group-photo:hover .fcj-group-photo__img {
        transform: scale(1.06);
    }
}

@media (hover: hover) and (prefers-reduced-motion: no-preference) {
    main img:not(.cinema-photo) {
        transition: transform 0.35s ease;
    }

    main a:hover img:not(.cinema-photo),
    main .fcj-hover-media:hover img,
    main img.fcj-hover-photo:hover {
        transform: scale(1.04);
    }

    main .fcj-cinema-hero img,
    main #hero-section img,
    main .fcj-cinema-hero a:hover img,
    main #hero-section a:hover img {
        transform: none;
    }

    main .fcj-hover-card {
        transition: transform 0.3s ease, box-shadow 0.3s ease;
    }

    main .fcj-hover-card:hover {
        transform: translateY(-4px);
        box-shadow: 0 18px 40px rgba(1, 27, 85, 0.12);
    }

    main h1 a,
    main h2 a,
    main h3 a {
        text-decoration-thickness: 1px;
        text-underline-offset: 0.18em;
    }

    main h1 a:hover,
    main h2 a:hover,
    main h3 a:hover {
        text-decoration-line: underline;
    }
}

@media (prefers-reduced-motion: reduce) {
    main .fcj-hover-card,
    main .fcj-hover-media img,
    main img:not(.cinema-photo) {
        transition: none;
    }
}
