/*
 * assets/css/historia/filosofia.css — Nuestro Tiempo Theme
 *
 * Estilos de la sección Filosofía de Producción.
 * Fondo oscuro (--c-negro), 4 pilares en grid, quote editorial.
 *
 * @package nuestro-tiempo
 */

.historia-filosofia {
    background-color: var(--c-negro);
    color: var(--c-crema);
    padding-block: var(--space-section);
}

.historia-filosofia__title {
    font-family: var(--f-serif);
    font-size: clamp(1.8rem, 3.5vw, 3rem);
    font-weight: 700;
    line-height: 1.2;
    margin-top: 1rem;
    margin-bottom: 2rem;
    color: var(--c-crema);
}

/* Cita editorial */
.historia-filosofia__quote {
    font-family: var(--f-serif);
    font-size: clamp(1rem, 1.8vw, 1.3rem);
    font-style: italic;
    line-height: 1.7;
    color: rgba(249, 247, 242, 0.65);
    border-left: 3px solid var(--c-cobre);
    padding-left: 1.5rem;
    margin: 0 0 4rem 0;
    max-width: 700px;
}

/* Grid de pilares */
.historia-filosofia__grid {
    list-style: none;
    padding: 0;
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
}

@media (min-width: 640px) {
    .historia-filosofia__grid {
        grid-template-columns: 1fr 1fr;
    }
}

@media (min-width: 1024px) {
    .historia-filosofia__grid {
        grid-template-columns: repeat(4, 1fr);
    }
}

/* Pilar individual */
.historia-filosofia__pilar {
    border: 1px solid rgba(249, 247, 242, 0.08);
    border-radius: 10px;
    padding: 2rem 1.5rem;
    background: rgba(255, 255, 255, 0.02);
    transition: background var(--transition-base), border-color var(--transition-base);
}

.historia-filosofia__pilar:hover {
    background: rgba(200, 121, 65, 0.06);
    border-color: rgba(200, 121, 65, 0.3);
}

.historia-filosofia__num {
    font-family: var(--f-serif);
    font-size: 3rem;
    font-weight: 700;
    color: rgba(200, 121, 65, 0.25);
    line-height: 1;
    display: block;
    margin-bottom: 1rem;
}

.historia-filosofia__pilar-title {
    font-family: var(--f-serif);
    font-size: var(--text-lg);
    font-weight: 700;
    color: var(--c-crema);
    margin-bottom: 0.75rem;
    line-height: 1.3;
}

.historia-filosofia__pilar-desc {
    font-family: var(--f-sans);
    font-size: var(--text-sm);
    color: rgba(249, 247, 242, 0.60);
    line-height: 1.6;
}