/* INFO_LEGAL.CSS */
/*
 * PÁGINA: Hoja de Estilos de Información Legal (Legal Info CSS) - As Tech Computer
 * PROPÓSITO: Centralizar y estandarizar la presentación visual de todos los documentos oficiales y normativos de la empresa (Política de Privacidad, Términos y Condiciones, Registro de Marca y Política de Cookies).
 * FUNCIONALIDADES:
 * - Configuración del contenedor principal para garantizar una lectura cómoda y profesional mediante márgenes amplios y un ancho máximo restringido.
 * - Establecimiento de una jerarquía visual clara utilizando los colores corporativos (púrpura y naranja) para resaltar títulos y subtítulos.
 * - Formateo optimizado de tipografía (ajustes de interlineado en párrafos y listas) orientado a prevenir la fatiga visual al leer textos legales densos.
 * - Definición de estilos interactivos (efectos hover, sombras y transiciones) para el botón de acción destinado a la descarga segura de archivos PDF.
 */

/* =========================================
   1. CONTENEDOR PRINCIPAL Y TIPOGRAFÍA BASE
   ========================================= */
/**
 * El sistema define el contenedor base de los documentos legales, 
 * restringiendo su ancho máximo y centrando el contenido en pantalla 
 * para facilitar el seguimiento de las líneas de texto.
 */
.seccion-legal {
    padding: 120px 20px 60px 20px;
    max-width: 900px;
    margin: 0 auto;
    background-color: #fff;
    font-family: 'Lato', sans-serif;
}

/* =========================================
   2. JERARQUÍA VISUAL DE ENCABEZADOS
   ========================================= */
/**
 * Se establece un sistema tipográfico estricto, aplicando la paleta 
 * corporativa y subrayados decorativos para distinguir visualmente 
 * los títulos principales (h1) de los subtítulos de sección (h3).
 */
.seccion-legal h1 {
    color: #52073a;
    margin-bottom: 20px;
    text-transform: uppercase;
    border-bottom: 3px solid #e06c00;
    padding-bottom: 10px;
    display: inline-block;
}

.seccion-legal h3 {
    color: #e06c00;
    margin-top: 30px;
    margin-bottom: 15px;
    font-size: 1.3rem;
}

/* =========================================
   3. FORMATO DE LECTURA (PÁRRAFOS Y LISTAS)
   ========================================= */
/**
 * El sistema incrementa el interlineado (line-height) y ajusta los 
 * márgenes de los párrafos y listas, asegurando que los bloques de 
 * texto extenso mantengan un aspecto limpio y accesible.
 */
.seccion-legal p {
    color: #444;
    line-height: 1.8;
    margin-bottom: 15px;
    font-size: 1.05rem;
}

.seccion-legal ul {
    margin-left: 20px;
    margin-bottom: 20px;
    color: #444;
    line-height: 1.8;
}

.seccion-legal li {
    margin-bottom: 10px;
}

.seccion-legal strong {
    color: #333;
}

.fecha-actualizacion {
    font-style: italic;
    color: #888;
    font-size: 0.9rem;
    margin-bottom: 30px;
    display: block;
}

/* =========================================
   4. BOTONES DE ACCIÓN LEGAL (DESCARGA DE PDF)
   ========================================= */
/**
 * Estilización interactiva del botón para descargar documentos legales. 
 * Integra un efecto de elevación espacial (translateY) y transiciones 
 * de color de la marca al momento de interactuar con el cursor.
 */
.btn-descargar-pdf {
    background-color: #e17203;
    color: #ffffff;
    padding: 12px 28px;
    border-radius: 30px;
    text-decoration: none;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    box-shadow: 0 4px 15px rgba(225, 114, 3, 0.3);
    transition: all 0.3s ease;
}

.btn-descargar-pdf:hover {
    background-color: #52073a;
    transform: translateY(-3px);
    box-shadow: 0 6px 20px rgba(82, 7, 58, 0.4);
    color: #ffffff;
}