/* ===== FUENTES PERSONALIZADAS ===== */

/* PETRONA - Para títulos */
@font-face {
    font-family: 'Petrona';
    src: url('../fonts/petrona/Petrona-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Petrona';
    src: url('../fonts/petrona/Petrona-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

/* THE CHAIRMAN - Para subtítulos */
@font-face {
    font-family: 'The Chairman';
    src: url('../fonts/the-chairman/TheChairman-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

/* TT NORMS - Para párrafos y textos generales */
@font-face {
    font-family: 'TT Norms';
    src: url('../fonts/tt-norms/TTNorms-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'TT Norms';
    src: url('../fonts/tt-norms/TTNorms-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

/* ===== FALLBACKS Y OPTIMIZACIONES ===== */

/* Fallbacks en caso de que las fuentes no carguen */
.font-petrona {
    font-family: 'Petrona', 'Georgia', 'Times New Roman', serif;
}

.font-chairman {
    font-family: 'The Chairman', 'Crimson Text', 'Georgia', serif;
}

.font-tt-norms {
    font-family: 'TT Norms', 'Inter', 'Helvetica Neue', 'Arial', sans-serif;
}

/* ===== CLASES DE UTILIDAD ESPECÍFICAS ===== */

/* Títulos - Petrona Medium 40pt */
.text-title {
    font-family: 'Petrona', 'Georgia', serif;
    font-size: 40px;
    font-weight: 500;
    /* Petrona-Medium */
    line-height: 1.2;
}

/* Títulos destacados - Petrona SemiBold */
.text-title-bold {
    font-family: 'Petrona', 'Georgia', serif;
    font-size: 40px;
    font-weight: 600;
    /* Petrona-SemiBold */
    line-height: 1.2;
}

/* Subtítulos - The Chairman Regular 45pt */
.text-subtitle {
    font-family: 'The Chairman', 'Georgia', serif;
    font-size: 45px;
    font-weight: 400;
    /* TheChairman-Regular */
    line-height: 1.1;
}

/* Párrafos - TT Norms Regular 17pt */
.text-paragraph {
    font-family: 'TT Norms', 'Arial', sans-serif;
    font-size: 17px;
    font-weight: 400;
    /* TTNorms-Regular */
    line-height: 1.6;
}

/* Header text - TT Norms Regular 15pt */
.text-header {
    font-family: 'TT Norms', 'Arial', sans-serif;
    font-size: 15px;
    font-weight: 400;
    /* TTNorms-Regular */
    line-height: 1.4;
}

/* Botones - TT Norms Medium 12pt */
.text-button {
    font-family: 'TT Norms', 'Arial', sans-serif;
    font-size: 12px;
    font-weight: 500;
    /* TTNorms-Medium */
    line-height: 1.2;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}

/* ===== RESPONSIVE TYPOGRAPHY ===== */

/* Tablet */
@media (max-width: 1024px) {
    .text-title {
        font-size: 36px;
    }

    .text-subtitle {
        font-size: 40px;
    }

    .text-paragraph {
        font-size: 16px;
    }
}

/* Mobile */
@media (max-width: 768px) {
    .text-title {
        font-size: 32px;
    }

    .text-subtitle {
        font-size: 35px;
    }

    .text-paragraph {
        font-size: 15px;
    }

    .text-header {
        font-size: 14px;
    }
}

/* Mobile small */
@media (max-width: 480px) {
    .text-title {
        font-size: 28px;
    }

    .text-subtitle {
        font-size: 30px;
    }

    .text-paragraph {
        font-size: 14px;
    }
}

/* ===== OPTIMIZACIONES DE RENDIMIENTO ===== */

/* Critical font loading */
@supports (font-display: optional) {
    @font-face {
        font-family: 'Petrona';
        src: url('../fonts/petrona/Petrona-Regular.ttf') format('truetype');
        font-weight: 400;
        font-display: optional;
    }
}

/* Prevent flash of invisible text */
.fonts-loading {
    visibility: hidden;
}

.fonts-loaded {
    visibility: visible;
}

/* ===== VARIABLES CSS PARA FUENTES ===== */
:root {
    --font-title: 'Petrona', 'Georgia', serif;
    --font-subtitle: 'The Chairman', 'Georgia', serif;
    --font-body: 'TT Norms', 'Arial', sans-serif;

    --size-title: 40px;
    --size-subtitle: 45px;
    --size-paragraph: 17px;
    --size-header: 15px;
    --size-button: 12px;

    /* Font weights disponibles */
    --weight-petrona-medium: 500;
    --weight-petrona-semibold: 600;
    --weight-chairman-regular: 400;
    --weight-tt-norms-regular: 400;
    --weight-tt-norms-medium: 500;

    /* Responsive sizes */
    --size-title-mobile: 28px;
    --size-subtitle-mobile: 30px;
    --size-paragraph-mobile: 14px;
}

/* ===== UTILIDADES ADICIONALES ===== */

/* Para texto con mejor legibilidad */
.text-optimized {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

/* Para títulos grandes */
.title-hero {
    font-family: var(--font-title);
    font-size: clamp(2rem, 5vw, 3.5rem);
    font-weight: 400;
    line-height: 1.1;
}

/* Para subtítulos */
.subtitle-section {
    font-family: var(--font-subtitle);
    font-size: clamp(1.8rem, 4vw, 2.8rem);
    font-weight: 400;
    line-height: 1.2;
}