/*
═══════════════════════════════════════════════════════════════════════════════
    INTEGRACIÓN DE FUENTES OPEN SANS - Dispositivo de Stewie
    
    Este archivo aplica la familia tipográfica Open Sans del PDF jpg.pdf
    a toda la plantilla web home-cybersecurity.html
    
    INSTRUCCIONES DE USO:
    1. Agregar este archivo después de style.css en el HTML
    2. O copiar el contenido al final de style.css
═══════════════════════════════════════════════════════════════════════════════
*/

/* ============================================================================
   IMPORTACIÓN DE OPEN SANS DESDE GOOGLE FONTS
   ============================================================================ */

@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500;1,600;1,700;1,800&display=swap');

/* ============================================================================
   VARIABLES CSS - REEMPLAZO DE FUENTES
   ============================================================================ */

:root {
    /* Fuentes principales */
    --title-font: "Open Sans", sans-serif !important;
    --body-font: "Open Sans", sans-serif !important;
    --style-font: "Open Sans", sans-serif !important;
}

/* ============================================================================
   APLICACIÓN GLOBAL
   ============================================================================ */

body {
    font-family: "Open Sans", sans-serif !important;
}

/* Títulos */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
.sec-title,
.hero-title,
.box-title {
    font-family: "Open Sans", sans-serif !important;
}

/* Texto de cuerpo */
p, span, a, li, td, th,
.sec-text,
.hero-text,
.about-item_text,
.service-box_text,
.feature-item_text {
    font-family: "Open Sans", sans-serif !important;
}

/* Botones */
.th-btn,
button,
input[type="submit"],
input[type="button"] {
    font-family: "Open Sans", sans-serif !important;
}

/* Navegación */
.main-menu,
.th-mobile-menu,
.menu-item,
nav a {
    font-family: "Open Sans", sans-serif !important;
}

/* Formularios */
input,
textarea,
select,
.form-control,
.form-select,
label {
    font-family: "Open Sans", sans-serif !important;
}

/* ============================================================================
   PESOS ESPECÍFICOS SEGÚN EL PDF
   ============================================================================ */

/* Títulos principales - Bold */
.hero-title,
.sec-title,
h1, .h1 {
    font-weight: 700 !important;
}

/* Subtítulos - Semi-bold */
h2, .h2,
h3, .h3,
.box-title {
    font-weight: 600 !important;
}

/* Títulos pequeños - Medium */
h4, .h4,
h5, .h5,
h6, .h6 {
    font-weight: 500 !important;
}

/* Texto normal - Regular */
p,
.sec-text,
.about-item_text,
body {
    font-weight: 400 !important;
}

/* Texto en cursiva (para énfasis) */
em,
.italic-text,
cite {
    font-style: italic !important;
    font-weight: 400 !important;
}

/* ============================================================================
   AJUSTES DE LEGIBILIDAD
   ============================================================================ */

body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

/* ============================================================================
   NOTAS DE IMPLEMENTACIÓN
   ============================================================================
   
   MAPEO DE SECCIONES PDF → HTML:
   
   1. "Nuestra Esencia" → .hero-title, .sec-title
   2. "Servicios IT Integrales" → .service-box .box-title
   3. "Desarrollamos soluciones..." → .hero-text, .sec-text
   logos. Navegación → .main-menu a
   5. Botones → .th-btn
   
   PESOS DISPONIBLES EN OPEN SANS:
   - 300 (Light)
   - 400 (Regular) ← Usado en el PDF
   - 500 (Medium)
   - 600 (Semi-bold)
   - 700 (Bold)
   - 800 (Extra-bold)
   
   ============================================================================ */