/* ==========================================================================
   Página: Por Qué Elegir Clubify
   ========================================================================== */

/* Tabla comparativa de Marketing */
.comparison-table {
    background-color: var(--color-blanco);
    border-radius: 15px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.07);
    overflow: hidden;
    font-size: 0.95rem;
}
.comparison-header, .comparison-row {
    display: grid;
    grid-template-columns: 2fr 1.5fr 3fr;
    gap: 15px;
    padding: 15px 20px;
    align-items: center;
}
.comparison-header {
    background-color: var(--color-negro);
    color: var(--color-blanco);
    font-weight: 600;
}
.comparison-row {
    border-top: 1px solid #e9ecef;
}
.comparison-row:hover {
    background-color: #f8f9fa;
}

/* Tarjetas del Ecosistema */
.ecosystem-card {
    padding: 30px;
}
.ecosystem-icon {
    font-size: 3rem;
    color: var(--color-principal);
    margin-bottom: 1.5rem;
}
.ecosystem-card h4 {
    font-weight: 600;
    color: var(--color-negro);
    margin-bottom: 0.75rem;
}
.ecosystem-card p {
    color: var(--color-gris-texto);
    line-height: 1.7;
}

/* Responsive para la tabla */
@media (max-width: 768px) {
    .comparison-header {
        display: none; /* Ocultamos la cabecera en móvil */
    }
    .comparison-row {
        grid-template-columns: 1fr; /* Apilamos las celdas */
        gap: 10px;
        padding: 20px;
        border-bottom: 2px solid #e9ecef;
    }
    .comparison-row div::before {
        font-weight: 600;
        display: block;
        margin-bottom: 5px;
        color: var(--color-negro);
    }
    .comparison-row div:nth-child(1)::before { content: 'Método:'; }
    .comparison-row div:nth-child(2)::before { content: 'Coste Típico:'; }
    .comparison-row div:nth-child(3)::before { content: 'El Problema:'; color: #c0392b; }
}

/* Estilo para páginas legales y texto denso */
.legal-content-section .content-block {
    margin-bottom: 2.5rem;
    padding: 1.5rem;
    border-bottom: 1px solid #eee;
}
.legal-content-section .content-block:last-child {
    border-bottom: none;
}
.legal-content-section h2.section-title {
    border-bottom: 2px solid var(--color-principal);
    padding-bottom: 10px;
    margin-bottom: 1.5rem;
    font-size: 1.5rem;
}
.legal-content-section p, .legal-content-section ul {
    line-height: 1.7;
    color: var(--color-gris-texto);
}
.legal-content-section strong {
    color: var(--color-negro);
}