/**
 * Page: Notre philosophie
 *
 * Hero + Histoire (reuses .tri-about from home.css) + Savoir-faire (reuses .tri-sf from home.css) + Team grid.
 *
 * @package Triennes
 */

/* ─── Hero ─── */
.tri-philo-hero {
    min-height: 75vh;
    background-size: cover;
    background-position: center 40%;
}

.tri-philo-hero .tri-hero__overlay {
    background: rgba(26, 43, 37, 0.35);
    padding-top: var(--tri-header-height, 150px);
    align-items: center;
    justify-content: center;
}

.tri-philo-hero__title {
    font-family: var(--tri-font-heading);
    font-size: clamp(2.5rem, 5vw, 4rem);
    font-weight: 500;
    color: var(--tri-white);
    margin-bottom: var(--tri-space-xs);
}

.tri-philo-hero__subtitle {
    font-family: var(--tri-font-heading);
    font-size: clamp(1rem, 2vw, 1.3rem);
    font-style: italic;
    color: rgba(247, 245, 240, 0.85);
}

/* ─── Section headers (bandeau) ─── */
.tri-philo-section-header {
    padding: var(--tri-space-md) 0;
    margin-bottom: var(--tri-space-sm);
    text-align: center;
    position: relative;
}

.tri-philo-section-header::after {
    content: '';
    display: block;
    width: 60px;
    height: 3px;
    background: var(--tri-terracotta);
    margin: var(--tri-space-sm) auto 0;
    border-radius: 2px;
}

/* ─── Histoire section spacing (TRI-2305: reduced white space) ─── */
.tri-philo-histoire {
    padding-bottom: var(--tri-space-md);
}

/* TRI-2305: Tighter spacing between philosophie sections */
.page-template-template-philosophie .tri-about.section {
    padding-top: var(--tri-space-lg);
    padding-bottom: 0;
}

.page-template-template-philosophie .tri-savoir-faire.section {
    padding-top: var(--tri-space-md);
    padding-bottom: var(--tri-space-md);
}

.page-template-template-philosophie .tri-philo-equipe {
    padding-top: 0;
    padding-bottom: 0;
}

/* ─── Team section ─── */
.tri-philo-equipe__overlay {
    padding: var(--tri-space-xl) 0;
    background: rgba(247, 245, 240, 0.83);
    background-image: var(--tri-equipe-bg);
    background-size: cover;
    background-position: center 30%;
    background-blend-mode: lighten;
}

.tri-philo-equipe .section__title {
    color: var(--tri-charcoal);
}

.tri-philo-equipe__prose {
    max-width: 720px;
    margin: 0 auto;
    text-align: center;
    font-size: 1.05rem;
    line-height: 1.9;
    color: var(--tri-text);
}

.tri-philo-equipe__dept {
    margin-bottom: var(--tri-space-xl);
}

.tri-philo-equipe__dept:last-child {
    margin-bottom: 0;
}

.tri-philo-equipe__dept-title {
    font-family: var(--tri-font-nav);
    font-size: 0.78rem;
    font-weight: 500;
    color: var(--tri-terracotta);
    text-transform: uppercase;
    letter-spacing: 0.12em;
    margin-bottom: var(--tri-space-md);
    text-align: center;
}

.tri-philo-equipe__grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, 220px);
    gap: var(--tri-space-lg);
    justify-content: center;
    max-width: 960px;
    margin: 0 auto;
}

.tri-philo-equipe__card {
    background: var(--tri-white);
    border: 1px solid var(--tri-border);
    border-radius: var(--tri-radius-md, 8px);
    padding: var(--tri-space-md);
    text-align: center;
    transition: box-shadow var(--tri-transition), transform var(--tri-transition);
}

.tri-philo-equipe__card:hover {
    box-shadow: 0 8px 24px rgba(26, 43, 37, 0.08);
    transform: translateY(-2px);
}

.tri-philo-equipe__photo {
    width: 120px;
    height: 120px;
    margin: 0 auto var(--tri-space-sm);
    border-radius: var(--tri-radius-md, 8px);
    overflow: hidden;
}

.tri-philo-equipe__photo svg,
.tri-philo-equipe__photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.tri-philo-equipe__name {
    font-family: var(--tri-font-heading);
    font-size: 1rem;
    font-weight: 500;
    color: var(--tri-cypress);
    margin: 0 0 0.15em;
}

.tri-philo-equipe__role {
    font-size: 0.82rem;
    color: var(--tri-text-muted);
    font-style: italic;
    margin: 0;
}

/* ─── Responsive ─── */
@media (max-width: 768px) {
    .tri-philo-hero {
        min-height: 60vh;
    }

    .tri-philo-section-header {
        padding: var(--tri-space-sm) 0;
    }

    .tri-philo-equipe__grid {
        grid-template-columns: repeat(auto-fit, 160px);
        gap: var(--tri-space-md);
    }

    .tri-philo-equipe__photo {
        width: 100px;
        height: 100px;
    }
}