/* ===== TYPOGRAPHY SCALE - URBANIST ===== */

/* Desktop (1200px et plus) */
h1 {
    font-size: 3rem;
    /* 48px */
    font-weight: 700;
    line-height: 1.1;
    margin-bottom: 1.5rem;
    font-family: 'Urbanist', sans-serif;
}

h2 {
    font-size: 2.5rem;
    /* 40px */
    font-weight: 600;
    line-height: 1.2;
    margin-bottom: 1.25rem;
    font-family: 'Urbanist', sans-serif;
}

h3 {
    font-size: 2rem;
    /* 32px */
    font-weight: 600;
    line-height: 1.3;
    margin-bottom: 1rem;
    font-family: 'Urbanist', sans-serif;
}

h4 {
    font-size: 1.5rem;
    /* 24px */
    font-weight: 500;
    line-height: 1.4;
    margin-bottom: 0.75rem;
    font-family: 'Urbanist', sans-serif;
}

h5 {
    font-size: 1.25rem;
    /* 20px */
    font-weight: 500;
    line-height: 1.4;
    margin-bottom: 0.5rem;
    font-family: 'Urbanist', sans-serif;
}

h6 {
    font-size: 1rem;
    /* 16px */
    font-weight: 500;
    line-height: 1.5;
    margin-bottom: 0.5rem;
    font-family: 'Urbanist', sans-serif;
}

/* Tablettes (992px - 1199px) */
@media (max-width: 1199px) {
    h1 {
        font-size: 2.75rem;
        /* 44px */
    }

    h2 {
        font-size: 2.25rem;
        /* 36px */
    }

    h3 {
        font-size: 1.875rem;
        /* 30px */
    }
}

/* Tablettes (768px - 991px) */
@media (max-width: 991px) {
    h1 {
        font-size: 2.5rem;
        /* 40px */
        line-height: 1.2;
    }

    h2 {
        font-size: 2rem;
        /* 32px */
        line-height: 1.3;
    }

    h3 {
        font-size: 1.75rem;
        /* 28px */
        line-height: 1.3;
    }

    h4 {
        font-size: 1.375rem;
        /* 22px */
    }
}

/* Mobiles paysage (576px - 767px) */
@media (max-width: 767px) {
    h1 {
        font-size: 2.25rem;
        /* 36px */
        line-height: 1.3;
        margin-bottom: 1.25rem;
    }

    h2 {
        font-size: 1.875rem;
        /* 30px */
        line-height: 1.3;
    }

    h3 {
        font-size: 1.625rem;
        /* 26px */
        line-height: 1.4;
    }

    h4 {
        font-size: 1.25rem;
        /* 20px */
        line-height: 1.4;
    }

    h5 {
        font-size: 1.125rem;
        /* 18px */
    }
}

/* Mobiles portrait (480px - 575px) */
@media (max-width: 575px) {
    h1 {
        font-size: 2rem;
        /* 32px */
        line-height: 1.3;
    }

    h2 {
        font-size: 1.75rem;
        /* 28px */
        line-height: 1.3;
    }

    h3 {
        font-size: 1.5rem;
        /* 24px */
        line-height: 1.4;
    }

    h4 {
        font-size: 1.125rem;
        /* 18px */
    }
}

/* Petits mobiles (moins de 480px) */
@media (max-width: 479px) {
    h1 {
        font-size: 1.75rem;
        /* 28px */
        line-height: 1.4;
        margin-bottom: 1rem;
    }

    h2 {
        font-size: 1.5rem;
        /* 24px */
        line-height: 1.4;
    }

    h3 {
        font-size: 1.375rem;
        /* 22px */
        line-height: 1.4;
    }

    h4 {
        font-size: 1.125rem;
        /* 18px */
    }

    h5 {
        font-size: 1rem;
        /* 16px */
    }
}

/* Très petits écrans (moins de 360px) */
@media (max-width: 359px) {
    h1 {
        font-size: 1.625rem;
        /* 26px */
    }

    h2 {
        font-size: 1.375rem;
        /* 22px */
    }

    h3 {
        font-size: 1.25rem;
        /* 20px */
    }
}