/**
 * =============================================================================
 * CRITICAL FIX: LETTER SPACING CORRECTION
 * =============================================================================
 *
 * PURPOSE:
 * - Fix extreme negative letter-spacing that causes text to appear without spaces
 * - Override problematic values from spacing-typography-optimization.css
 * - Maintain readability while preserving design intent
 *
 * ISSUE:
 * - Previous letter-spacing values of -2.5px to -2px caused letters to overlap
 * - Text appeared as "Ahorodetiempo" instead of "Ahorro de tiempo"
 * - Affected all h2 and h3 headings across the site
 *
 * SOLUTION:
 * - Reset letter-spacing to 0 or slightly negative values
 * - Preserve font-size and line-height optimizations
 * - Apply fixes with !important to override existing rules
 *
 * CREATED: 2025-11-20
 * =============================================================================
 */

/* =================================================================== */
/* CRITICAL FIXES - LETTER SPACING */
/* =================================================================== */

/**
 * Main section headings - FIXED
 * Previous: letter-spacing: -2.5px (too extreme)
 * New: letter-spacing: -0.5px (subtle tightening)
 */
.section_integrations h2,
.section_features h2,
.section_video h2,
.section_testimonial h2 {
    letter-spacing: -0.5px !important;
}

/**
 * Subsection headings - FIXED
 * Previous: letter-spacing: -2px (too extreme)
 * New: letter-spacing: -0.3px (subtle tightening)
 */
.features_content h2.heading-style-h3,
.features_content h3.heading-style-h3 {
    letter-spacing: -0.3px !important;
}

/**
 * All h3 headings - FIXED
 * Ensure all h3 elements have proper spacing
 */
h3, .heading-style-h3 {
    letter-spacing: -0.3px !important;
}

/**
 * Body text - FIXED
 * Previous: letter-spacing: -0.2px (acceptable but can be improved)
 * New: letter-spacing: 0 (normal spacing for better readability)
 */
.text-size-medium {
    letter-spacing: 0 !important;
}

/* =================================================================== */
/* RESPONSIVE FIXES */
/* =================================================================== */

/**
 * TABLET (max-width: 991px)
 */
@media screen and (max-width: 991px) {
    .section_integrations h2,
    .section_features h2,
    .section_video h2 {
        letter-spacing: -0.4px !important;
    }

    .features_content h2.heading-style-h3,
    .features_content h3.heading-style-h3 {
        letter-spacing: -0.25px !important;
    }
}

/**
 * MOBILE LANDSCAPE (max-width: 767px)
 */
@media screen and (max-width: 767px) {
    .section_integrations h2,
    .section_features h2,
    .section_video h2 {
        letter-spacing: -0.3px !important;
    }

    .features_content h2.heading-style-h3,
    .features_content h3.heading-style-h3 {
        letter-spacing: -0.2px !important;
    }
}

/**
 * MOBILE PORTRAIT (max-width: 479px)
 */
@media screen and (max-width: 479px) {
    .heading-style-h1 {
        letter-spacing: -0.5px !important;
    }

    .section_integrations h2,
    .section_features h2,
    .section_video h2 {
        letter-spacing: -0.2px !important;
    }

    .features_content h2.heading-style-h3,
    .features_content h3.heading-style-h3 {
        letter-spacing: 0 !important;
    }
}

/**
 * EXTRA SMALL MOBILE (max-width: 375px)
 */
@media screen and (max-width: 375px) {
    .heading-style-h1 {
        letter-spacing: -0.3px !important;
    }
}

/* =================================================================== */
/* ADDITIONAL SPACING IMPROVEMENTS */
/* =================================================================== */

/**
 * Ensure word spacing is normal (not negative)
 * This is critical to prevent words from merging
 */
h1, h2, h3, h4, h5, h6,
.heading-style-h1,
.heading-style-h2,
.heading-style-h3 {
    word-spacing: normal !important;
}

/**
 * Ensure proper spacing in benefit cards and feature cards
 */
.benefit-card h3,
.features_content h2,
.features_content h3 {
    word-spacing: normal !important;
    letter-spacing: -0.3px !important;
}

/* =================================================================== */
/* END OF LETTER SPACING FIXES */
/* =================================================================== */
